@aicayzer/inkkit 0.1.7 → 0.3.0

package/README.md

@@ -1,48 +1,32 @@
 # Inkkit
 
-A Markdown editor for the web and for apps that host a web view. It edits formatted text and keeps your Markdown as you wrote it: a document you open and leave is saved unchanged, and an edit rewrites only the blocks it touches.
+A Markdown editor for web pages and for apps that host a web view. People edit formatted text, and your app saves the Markdown as it was written: an unedited document is saved unchanged, and an edit rewrites only the blocks it touches.
 
-- Formatted and source editing, with one undo history
-- Tables, task lists, footnotes, callouts, highlights and reference links
-- Mermaid diagram previews, offline
-- Copy as readable text or HTML, or copy the Markdown itself
-- Images and files through your own storage adapter
-- Your app owns the toolbar, menus, files and appearance
-
-## How it works
+<details>
+<summary>How Inkkit preserves Markdown</summary>
 
 <picture>
-  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/aicayzer/inkkit/main/docs/images/how-inkkit-works-dark.svg">
-  <img src="https://raw.githubusercontent.com/aicayzer/inkkit/main/docs/images/how-inkkit-works.svg" width="800" alt="An ordinary Markdown editor rebuilds the whole file when it saves, so list markers, spacing and escaping change. Inkkit loads the file and edits it formatted with Milkdown. A preservation layer between Milkdown and the file saves a note you open and leave byte for byte unchanged. After an edit, it keeps unchanged blocks as their original bytes, writes only edited blocks with Milkdown, and reads the result back. If it reopens as the same document, the edit is kept and saved. If not, the edit is refused and the note stays as it was. Your app owns the files, storage, toolbar and appearance.">
+  <source media="(prefers-color-scheme: dark)" srcset="docs/images/how-inkkit-works-dark.svg">
+  <img src="docs/images/how-inkkit-works.svg" alt="Inkkit keeps unchanged source and checks edited blocks before your app saves them.">
 </picture>
 
-A formatted Markdown editor usually rebuilds the whole file when it saves, so opening and saving a note can change list markers, spacing and escaping that you never touched. Inkkit adds a preservation layer between [Milkdown](https://milkdown.dev) and the file. A note that you open and leave is saved byte for byte unchanged, and after an edit only the blocks you edited are rewritten. Inkkit reads the result of each edit back and refuses the edit if it would not reopen as the same document.
-
-For the exact guarantees, see [Preservation](https://github.com/aicayzer/inkkit/blob/main/docs/preservation.md).
+</details>
 
-## Install
+## Get started
 
 ```sh
 npm install @aicayzer/inkkit
 ```
 
-An app that does not render diagrams can import from `@aicayzer/inkkit/core` instead. That entry leaves Mermaid out of the app's bundle and keeps diagrams as editable source. See [Builds without diagrams](https://github.com/aicayzer/inkkit/blob/main/docs/api.md#builds-without-diagrams).
-
-## Supported engines
-
-Inkkit supports Safari and `WKWebView` 17.5 or later (iOS 17.5, macOS 14.5), Chrome and Edge 123 or later, and Firefox 125 or later. The host page must declare UTF-8. See [Supported engines](https://github.com/aicayzer/inkkit/blob/main/docs/integration.md#supported-engines) for the APIs behind these versions.
-
-## Use
-
 ```ts
 import { InkKitEditor } from '@aicayzer/inkkit'
 import '@aicayzer/inkkit/style.css'
 
 const editor = await InkKitEditor.mount(document.getElementById('editor')!, {
-  changed({ generation, revision, text }) {},
-  commandStateChanged({ caret }) {},
-  openLink(href) {},
-  copy(text) {},
+  changed() {},
+  error(error) {
+    console.error(error.code, error.message)
+  },
 })
 
 editor.loadDocument({
@@ -55,17 +39,9 @@ editor.loadDocument({
 const { text } = editor.snapshot(1)
 ```
 
-## Built with Inkkit
-
-- [Memos](https://github.com/aicayzer/memos): a small Mac app for memos, in one floating window
-- [PadPad](https://github.com/aicayzer/padpad): a small Mac app for quick text and files
-
-## Learn more
+## Documentation
 
-- [Supported syntax](https://github.com/aicayzer/inkkit/blob/main/docs/supported-syntax.md)
-- [Integration guide](https://github.com/aicayzer/inkkit/blob/main/docs/integration.md)
-- [API reference](https://github.com/aicayzer/inkkit/blob/main/docs/api.md)
-- [All documentation](https://github.com/aicayzer/inkkit/blob/main/docs/README.md)
+[inkkit.cyzr.me](https://inkkit.cyzr.me) covers how Inkkit works, compatibility, integration guides and the API reference.
 
 ## License
 

package/dist/chunks/{core-DkL-wDqy.js → core-DrVCeBzK.js}

@@ -35008,7 +35008,7 @@ var associationAttrs = {
 	identifier: { default: "" }
 };
 /** Whether an element reads as `text`, with whitespace collapsed as shown. */
-function showsText$1(dom, text) {
+function showsText(dom, text) {
 	const shown = (value) => value.replace(/\s+/g, " ").trim();
 	return shown(dom.textContent ?? "") === shown(text);
 }
@@ -35033,7 +35033,7 @@ var references = [
 				const url = dom.getAttribute("data-inkkit-url") ?? "";
 				const label = dom.getAttribute("data-inkkit-label") ?? "";
 				const title = dom.getAttribute("data-inkkit-title");
-				if (!isSafeLinkTarget(url) || !showsText$1(dom, definitionText(label, url, title))) return false;
+				if (!isSafeLinkTarget(url) || !showsText(dom, definitionText(label, url, title))) return false;
 				return {
 					label,
 					identifier: dom.getAttribute("data-inkkit-reference-definition") ?? "",
@@ -35085,7 +35085,7 @@ var references = [
 			tag: "sup[data-inkkit-footnote-reference]",
 			getAttrs: (dom) => {
 				const label = dom.getAttribute("data-inkkit-label") ?? "";
-				return showsText$1(dom, label) ? {
+				return showsText(dom, label) ? {
 					label,
 					identifier: dom.getAttribute("data-inkkit-footnote-reference") ?? ""
 				} : false;
@@ -35529,7 +35529,7 @@ var wikiLinkSchema = $node("inkkit_wiki_link", () => ({
 		tag: "span[data-inkkit-wiki]",
 		getAttrs(dom) {
 			const parsed = parseLinkedSyntax(dom.getAttribute("data-inkkit-wiki-raw") ?? "", dom.getAttribute("data-inkkit-wiki-table") === "true");
-			return parsed && !parsed.embed && showsWikiTarget(parsed) && showsText$1(dom, parsed.label) ? {
+			return parsed && !parsed.embed && showsWikiTarget(parsed) && showsText(dom, parsed.label) ? {
 				raw: parsed.raw,
 				target: parsed.target,
 				fragment: parsed.fragment,
@@ -43687,27 +43687,9 @@ function remarkComments() {
 	});
 	return (tree) => {
 		const visit = (node, inline, parentType) => {
-			if (parentType === "listItem" && node.type === "inkkitCommentBlock") return {
-				type: "paragraph",
-				children: [{
-					...node,
-					type: "inkkitCommentInline",
-					block: true
-				}],
-				position: node.position
-			};
 			if (node.type === "html") {
 				const spans = htmlSpans(node.value);
-				if (spans.length === 1 && spans[0].start === 0 && spans[0].end === node.value.length) return parentType === "listItem" ? {
-					type: "paragraph",
-					children: [{
-						type: "inkkitCommentInline",
-						syntax: "html",
-						value: spans[0].value,
-						position: node.position
-					}],
-					position: node.position
-				} : {
+				if (spans.length === 1 && spans[0].start === 0 && spans[0].end === node.value.length) return {
 					type: inline ? "inkkitCommentInline" : "inkkitCommentBlock",
 					syntax: "html",
 					value: spans[0].value,
@@ -43736,6 +43718,7 @@ function commentNode(inline) {
 		marks: "",
 		code: true,
 		defining: true,
+		createGapCursor: !inline,
 		attrs: {
 			syntax: { default: "html" },
 			block: { default: !inline }
@@ -44482,7 +44465,7 @@ function isHTMLElement(node) {
 	return isElement(node) && node.namespaceURI === "http://www.w3.org/1999/xhtml";
 }
 //#endregion
-//#region node_modules/.pnpm/prosemirror-drop-indicator@0.1.4/node_modules/prosemirror-drop-indicator/dist/index.js
+//#region node_modules/.pnpm/prosemirror-drop-indicator@0.1.4_patch_hash=4afd7e652c59a5f25f8ecc7b74d6370bde7273ee46a28766df1490663f928940/node_modules/prosemirror-drop-indicator/dist/index.js
 function getTargetsByView(view) {
 	const stack = [[-1, view.state.doc]];
 	const targets = [];
@@ -44638,6 +44621,8 @@ function createDropIndicatorView(view, getTarget, options) {
 	let hasDragOverEvent = false;
 	const scheduleHide = () => {
 		if (hideId) clearTimeout(hideId);
+		prevX = void 0;
+		prevY = void 0;
 		hasDragOverEvent = false;
 		hideId = setTimeout(() => {
 			if (hasDragOverEvent) return;
@@ -44678,6 +44663,7 @@ function createDropIndicatorView(view, getTarget, options) {
 	dom.addEventListener("drop", scheduleHide);
 	dom.addEventListener("dragleave", scheduleHide);
 	const destroy = () => {
+		if (hideId) clearTimeout(hideId);
 		dom.removeEventListener("dragover", handleDragOver);
 		dom.removeEventListener("dragend", scheduleHide);
 		dom.removeEventListener("drop", scheduleHide);
@@ -44924,50 +44910,63 @@ function blockDropRange(view, x, y) {
 * callout, where typing would change text the reader can't see or didn't
 * choose.
 */
-function caretAfter(doc, pos) {
+function caretAfter(doc, pos, folds = /* @__PURE__ */ new Map()) {
+	const hides = (node) => isComment(node) || node.type.name === "inkkit_callout" && (folds.get(node) ?? node.attrs.fold === "-");
+	const concealedDepth = ($pos) => {
+		for (let depth = 1; depth <= $pos.depth; depth++) if (hides($pos.node(depth))) return depth;
+		return -1;
+	};
+	const concealed = ($pos) => concealedDepth($pos) >= 0;
 	const $pos = doc.resolve(pos);
 	const before = $pos.nodeBefore;
 	if (before?.isTextblock && !concealed(doc.resolve(pos - 1))) return TextSelection.create(doc, pos - 1);
-	if (GapCursor.valid($pos)) return new GapCursor($pos);
+	const gap = GapCursor;
+	const forward = before && !showsText(before) ? shownText(doc, pos, 1) : null;
+	if (forward) return forward;
+	if (gap.valid($pos)) return new GapCursor($pos);
 	const [first, second] = before && !showsText(before) ? [1, -1] : [-1, 1];
 	return shownText(doc, pos, first) ?? shownText(doc, pos, second) ?? Selection.near($pos);
-}
-function hides(node) {
-	return isComment(node) || node.type.name === "inkkit_callout" && node.attrs.fold === "-";
-}
-function concealedDepth($pos) {
-	for (let depth = 1; depth <= $pos.depth; depth++) if (hides($pos.node(depth))) return depth;
-	return -1;
-}
-function concealed($pos) {
-	return concealedDepth($pos) >= 0;
-}
-function showsText(node) {
-	if (hides(node)) return false;
-	if (node.isTextblock) return true;
-	let found = false;
-	node.descendants((child) => {
-		if (found || hides(child)) return false;
-		if (child.isTextblock) found = true;
-		return !found;
-	});
-	return found;
-}
-function shownText(doc, pos, dir) {
-	let $from = doc.resolve(pos);
-	for (;;) {
-		const found = TextSelection.findFrom($from, dir, true);
-		if (!found) return null;
-		const depth = concealedDepth(found.$head);
-		if (depth < 0) return found;
-		$from = doc.resolve(dir > 0 ? found.$head.after(depth) : found.$head.before(depth));
+	function showsText(node) {
+		if (hides(node)) return false;
+		if (node.isTextblock) return true;
+		let found = false;
+		node.descendants((child) => {
+			if (found || hides(child)) return false;
+			if (child.isTextblock) found = true;
+			return !found;
+		});
+		return found;
 	}
+	function shownText(doc, pos, dir) {
+		let $from = doc.resolve(pos);
+		for (;;) {
+			const found = TextSelection.findFrom($from, dir, true);
+			if (!found) return null;
+			const depth = concealedDepth(found.$head);
+			if (depth < 0) return found;
+			$from = doc.resolve(dir > 0 ? found.$head.after(depth) : found.$head.before(depth));
+		}
+	}
+}
+/** Capture reader folding before dispatch, then map it to the new document. */
+function calloutFolds(view, tr) {
+	const folds = /* @__PURE__ */ new Map();
+	view.state.doc.descendants((node, pos) => {
+		if (node.type.name !== "inkkit_callout") return;
+		const dom = view.nodeDOM(pos);
+		if (!(dom instanceof HTMLElement)) return;
+		const mapped = tr.mapping.mapResult(pos, 1);
+		if (mapped.deleted) return;
+		const next = tr.doc.nodeAt(mapped.pos);
+		if (next?.type === node.type) folds.set(next, dom.getAttribute("data-inkkit-folded") === "true");
+	});
+	return folds;
 }
 /**
 * Puts the caret just after what the transaction's last step inserted, so
 * typing continues after pasted or dropped content instead of replacing it.
 */
-function caretAfterInsertion(tr) {
+function caretAfterInsertion(tr, view) {
 	const map = tr.mapping.maps[tr.mapping.maps.length - 1];
 	let end;
 	map?.forEach((_from, _to, _newFrom, newTo) => {
@@ -44975,7 +44974,7 @@ function caretAfterInsertion(tr) {
 	});
 	if (end == null) return tr;
 	const $end = tr.doc.resolve(end);
-	return tr.setSelection($end.parent.inlineContent ? TextSelection.create(tr.doc, end) : caretAfter(tr.doc, end));
+	return tr.setSelection($end.parent.inlineContent ? TextSelection.create(tr.doc, end) : caretAfter(tr.doc, end, view && calloutFolds(view, tr)));
 }
 //#endregion
 //#region src/code-fences.ts
@@ -45768,6 +45767,18 @@ function retainText(raw, before, after, inTable = false, written, beside = [fals
 	const read = decodedOffsets(raw, true);
 	if (read?.decoded !== before) return after;
 	const { offsets } = read;
+	const lineStart = after.lastIndexOf("\n", prefix - 1) + 1;
+	if (lineStart > 0 && written !== void 0) {
+		const canonical = decodedOffsets(written, true);
+		if (canonical?.decoded === after) {
+			const opening = written.slice(canonical.offsets[lineStart]);
+			const marker = /^(?:\d+)?\\[#+.\->)]/.exec(opening)?.[0];
+			if (marker && prefix - lineStart <= decodedOffsets(marker).decoded.length) {
+				prefix = lineStart;
+				return raw.slice(0, offsets[prefix]) + written.slice(canonical.offsets[prefix], canonical.offsets[after.length - suffix]) + raw.slice(offsets[before.length - suffix]);
+			}
+		}
+	}
 	if (written !== void 0 && (beside[0] && prefix === 0 || beside[1] && suffix === 0)) {
 		const writtenOffsets = decodedOffsets(written);
 		if (writtenOffsets && writtenOffsets.decoded === after) return raw.slice(0, offsets[prefix]) + written.slice(writtenOffsets.offsets[prefix], writtenOffsets.offsets[after.length - suffix]) + raw.slice(offsets[before.length - suffix]);
@@ -48200,6 +48211,7 @@ var calloutSchema = $node("inkkit_callout", (ctx) => ({
 	group: "block",
 	content: "block+",
 	defining: true,
+	createGapCursor: true,
 	attrs: {
 		kind: { default: "NOTE" },
 		marker: { default: "[!NOTE]" },
@@ -53851,7 +53863,7 @@ function pasteSpreadsheet(ctx, input, at) {
 	}
 	let grid;
 	try {
-		grid = input.html?.match(/<table[\s>]/i) ? htmlGrid(view.state.schema, input.html) : input.text.includes("	") ? textGrid(view.state.schema, input.text) : void 0;
+		grid = input.html?.match(/<table[\s>]/i) ? htmlGrid(view.state.schema, input.html) : !input.html && input.text.includes("	") && (inTable || looksLikeGrid(input.text)) ? textGrid(view.state.schema, input.text) : void 0;
 	} catch (error) {
 		if (inTable || !input.html) throw error;
 		if (!standaloneTable(input.html)) return false;
@@ -53869,7 +53881,7 @@ function pasteSpreadsheet(ctx, input, at) {
 		if (cursor < input.html.length) children.push(schema.text(input.html.slice(cursor)));
 		const content = importableSlice(ctx, new Slice(Fragment.from(schema.nodes.literal_markdown.create(null, children)), 0, 0)).content;
 		const selection = view.state.selection;
-		dispatchTableOperation(view, at ? caretAfterInsertion(view.state.tr.replaceWith(at.from, at.to, content)) : selection.$from.parent.type.name === "paragraph" && selection.empty && selection.$from.parent.content.size === 0 ? view.state.tr.replaceWith(selection.$from.before(), selection.$from.after(), content) : content.childCount === 1 ? view.state.tr.replaceSelectionWith(content.firstChild) : view.state.tr.replaceSelection(new Slice(content, 0, 0)));
+		dispatchTableOperation(view, at ? caretAfterInsertion(view.state.tr.replaceWith(at.from, at.to, content), view) : selection.$from.parent.type.name === "paragraph" && selection.empty && selection.$from.parent.content.size === 0 ? view.state.tr.replaceWith(selection.$from.before(), selection.$from.after(), content) : content.childCount === 1 ? view.state.tr.replaceSelectionWith(content.firstChild) : view.state.tr.replaceSelection(new Slice(content, 0, 0)));
 		return true;
 	}
 	if (!grid) return false;
@@ -53884,7 +53896,7 @@ function pasteSpreadsheet(ctx, input, at) {
 			if (node === table) tableStart = pos + 1;
 		});
 		if (tableStart < 0) reject();
-		tr.setSelection(caretAfter(tr.doc, tableStart - 1 + table.nodeSize));
+		tr.setSelection(caretAfter(tr.doc, tableStart - 1 + table.nodeSize, calloutFolds(view, tr)));
 		dispatchTableOperation(view, tr);
 		return true;
 	}
@@ -53929,6 +53941,12 @@ function standaloneTable(html) {
 function reject() {
 	throw new InkKitError("preservation", "This spreadsheet cannot be represented safely in a Markdown table. Paste as plain text outside the table to retain its source.");
 }
+function looksLikeGrid(input) {
+	const rows = input.replace(/\r\n?/g, "\n").replace(/\n$/, "").split("\n");
+	if (rows.length < 2) return false;
+	const widths = rows.map((row) => row.split("	").length);
+	return widths[0] > 1 && widths.every((width) => width === widths[0]) && rows.some((row) => row.split("	")[0].trim().length > 0);
+}
 function textGrid(schema, input) {
 	const text = input.replace(/\r\n?/g, "\n").replace(/\n$/, "");
 	const rows = [[]];
@@ -54119,7 +54137,10 @@ var PasteController = class {
 		return mapped?.operation === operation ? mapped : operation;
 	}
 	cancelPending() {
+		const operation = this.active;
+		if (!operation) return;
 		this.active = void 0;
+		operation.controller.abort();
 		this.options.onPendingChanged?.();
 	}
 	destroy() {
@@ -54131,6 +54152,26 @@ var PasteController = class {
 		const current = this.options.context();
 		if (this.active !== operation || current.documentId !== context.documentId || current.generation !== context.generation) throw new InkKitError("stale-document", "The document changed while images were importing.");
 	}
+	async importImage(image, context, operation) {
+		this.assertContext(context, operation);
+		const signal = operation.controller.signal;
+		let abort;
+		const cancelled = new Promise((_, reject) => {
+			abort = () => reject(new InkKitError(this.dead ? "destroyed" : "stale-document", "The image import was cancelled."));
+			signal.addEventListener("abort", abort, { once: true });
+		});
+		try {
+			return await Promise.race([new Promise((resolve) => {
+				resolve(this.options.adapter.importImage(image, {
+					...context,
+					signal
+				}));
+			}), cancelled]);
+		} finally {
+			signal.removeEventListener("abort", abort);
+			this.assertContext(context, operation);
+		}
+	}
 	commit(apply) {
 		return this.options.commit ? this.options.commit(apply) : apply();
 	}
@@ -54145,7 +54186,7 @@ var PasteController = class {
 		const blocks = Fragment.fromArray(topLevel(view.state.schema, slice.content));
 		const tr = view.state.tr.replaceWith(range.from, range.to, blocks);
 		const end = tr.mapping.map(range.to);
-		this.dispatch(view, tr.setSelection(caretAfter(tr.doc, end)).scrollIntoView());
+		this.dispatch(view, tr.setSelection(caretAfter(tr.doc, end, calloutFolds(view, tr))).scrollIntoView());
 	}
 	/** Imports the input at the selection, or in place of `target`. */
 	async run(input, files = [], target) {
@@ -54162,9 +54203,12 @@ var PasteController = class {
 			from: exit,
 			to: exit
 		};
-		const operation = target ? { ...target } : {
-			from: view.state.selection.from,
-			to: view.state.selection.to
+		const operation = {
+			...target ?? {
+				from: view.state.selection.from,
+				to: view.state.selection.to
+			},
+			controller: new AbortController()
 		};
 		const inCode = () => view.state.doc.resolve(this.anchor(operation).from).parent.type.spec.code;
 		this.active = operation;
@@ -54213,14 +54257,14 @@ var PasteController = class {
 						if (!reference) {
 							const captured = images.find((image) => image.source === source) ?? dataImage(source) ?? positional[index++];
 							if (!captured || !this.options.adapter) throw new Error("The pasted image is unavailable.");
-							reference = (await this.options.adapter.importImage(captured, { ...context })).reference;
+							reference = (await this.importImage(captured, context, operation)).reference;
 							this.assertContext(context, operation);
 							imported.set(source, reference);
 						}
 						element.setAttribute("src", reference);
 						element.removeAttribute("srcset");
 					} catch (error) {
-						if (error instanceof InkKitError) throw error;
+						if (error instanceof InkKitError && error.code !== "image-unavailable") throw error;
 						element.replaceWith(document.createTextNode(`[${alt}: image unavailable]`));
 						this.options.onError?.(coded(error, "image-unavailable", error instanceof Error ? error.message : "The pasted image is unavailable."));
 					}
@@ -54265,7 +54309,7 @@ var PasteController = class {
 				if (input.text) nodes.push(schema.nodes.paragraph.create(null, schema.text(input.text)));
 				for (const image of images) try {
 					if (!this.options.adapter) throw new InkKitError("image-unavailable", "No image adapter is configured.");
-					const imported = await this.options.adapter.importImage(image, { ...context });
+					const imported = await this.importImage(image, context, operation);
 					this.assertContext(context, operation);
 					const imageNode = schema.nodes.image?.create({
 						src: imported.reference,
@@ -54312,8 +54356,8 @@ var PasteController = class {
 				});
 				return;
 			}
-			if (anchor.from === anchor.to && insertion.parent.type.name === "paragraph" && insertion.parent.content.size === 0 && slice.content.firstChild?.isBlock && slice.content.firstChild.type.spec.isolating) this.dispatch(view, caretAfterInsertion(view.state.tr.replaceRange(insertion.before(), insertion.after(), new Slice(slice.content, 0, 0))).scrollIntoView());
-			else this.dispatch(view, caretAfterInsertion(view.state.tr.replaceRange(anchor.from, anchor.to, source == null ? slice : withEdgeSpaces(slice, source, view.state.doc.resolve(anchor.from), view.state.doc.resolve(anchor.to)))).scrollIntoView());
+			if (anchor.from === anchor.to && insertion.parent.type.name === "paragraph" && insertion.parent.content.size === 0 && slice.content.firstChild?.isBlock && slice.content.firstChild.type.spec.isolating) this.dispatch(view, caretAfterInsertion(view.state.tr.replaceRange(insertion.before(), insertion.after(), new Slice(slice.content, 0, 0)), view).scrollIntoView());
+			else this.dispatch(view, caretAfterInsertion(view.state.tr.replaceRange(anchor.from, anchor.to, source == null ? slice : withEdgeSpaces(slice, source, view.state.doc.resolve(anchor.from), view.state.doc.resolve(anchor.to))), view).scrollIntoView());
 		} finally {
 			if (this.active === operation) {
 				this.active = void 0;
@@ -55315,17 +55359,35 @@ function navigateFormattedHeading(view, requested, context) {
 }
 //#endregion
 //#region src/tasks.ts
+function onTaskMarker(event) {
+	const target = event.target;
+	if (!(target instanceof HTMLElement) || !target.matches("li[data-item-type=\"task\"]")) return false;
+	const marker = getComputedStyle(target, "::before");
+	const rect = target.getBoundingClientRect();
+	const left = rect.left + parseFloat(marker.left);
+	const top = rect.top + parseFloat(marker.top);
+	return event.clientX >= left && event.clientX <= left + parseFloat(marker.width) && event.clientY >= top && event.clientY <= top + parseFloat(marker.height);
+}
 var taskListPlugin = $prose(() => new Plugin({
 	key: new PluginKey("taskToggle"),
-	props: { handleClickOn(view, _pos, node, nodePos, event) {
-		if (!view.editable) return false;
-		if (node.type.name !== "list_item" || node.attrs.checked == null) return false;
-		if (!event.target.matches("li[data-item-type=\"task\"]")) return false;
-		view.dispatch(view.state.tr.setNodeMarkup(nodePos, void 0, {
-			...node.attrs,
-			checked: !node.attrs.checked
-		}));
-		return true;
+	props: { handleDOMEvents: {
+		mousedown(view, event) {
+			if (!view.editable || event.button !== 0 || !onTaskMarker(event)) return false;
+			event.preventDefault();
+			return true;
+		},
+		click(view, event) {
+			if (!view.editable || event.button !== 0 || !onTaskMarker(event)) return false;
+			const nodePos = view.posAtDOM(event.target, 0) - 1;
+			const node = view.state.doc.nodeAt(nodePos);
+			if (node?.type.name !== "list_item" || node.attrs.checked == null) return false;
+			event.preventDefault();
+			view.dispatch(view.state.tr.setNodeMarkup(nodePos, void 0, {
+				...node.attrs,
+				checked: !node.attrs.checked
+			}));
+			return true;
+		}
 	} }
 }));
 function listItemsInSelection(view) {
@@ -56219,7 +56281,7 @@ var sourceGroupDelay = 500;
 var sourceStepLimit = 100;
 /**
 * The editor. Create it with `InkKitEditor.mount`, load a document, and read it back with
-* `snapshot`. The reference is https://github.com/aicayzer/inkkit/blob/main/docs/api.md.
+* `snapshot`. The reference is https://inkkit.cyzr.me/reference/editor.
 */
 var InkKitEditor = class InkKitEditor {
 	options;
@@ -57157,6 +57219,11 @@ var InkKitEditor = class InkKitEditor {
 			...result
 		};
 	}
+	/** Cancels the pending image paste without changing the document or editability. */
+	cancelPendingImports(expectedGeneration) {
+		this.assertReady(expectedGeneration);
+		this.pasteController.cancelPending();
+	}
 	/** Pastes content the host read from the native clipboard. Capture it once; don't read the
 	*  clipboard again while this runs. */
 	async paste(input, expectedGeneration) {
@@ -57440,7 +57507,7 @@ var InkKitEditor = class InkKitEditor {
 					return true;
 				}
 			}));
-		}).use(labelsCtx).use(instance.pasteController.plugin).use(visibleClipboard).use($prose(() => instance.suggestions.plugin())).use(instance.keymapPlugin).use(createDialect(Boolean(options.images || options.files), Boolean(options.wikiLinks), Boolean(options.files))).use(codeControlCtx).use(codeControlsPlugin(() => instance.viewport().rect)).use(tablePlugins).use(tableBlock).use(instance.changePlugin).use(instance.historyInputPlugin).use(history).use(clipboard).use(cursor).use(taskListPlugin).use(quoteBackspace).use(calloutEnter).use(literalEnter).use(literalReread).use(listItemBackspace).use(listItemShiftTab).use(nestedItemEnter).use(rejoinLists).use(movedListItems).use(textInputPolicy).use(events.copy ? codeCopyPlugin((text) => events.copy?.(text)) : []).use(placeholderPlugin).use(options.rendering?.codeHighlighting === false ? [] : (await import("./highlight-TSUdUlMi.js")).highlightPlugin).use(options.rendering?.diagramPreview === false || !diagramsAvailable() ? [] : mermaidPreview((error) => instance.report(error))).use(selectionPlugin).use($prose(() => search())).use(instance.policyPlugin).use(options.wikiLinks ? wikiLinkView(options.wikiLinks, {
+		}).use(labelsCtx).use(instance.pasteController.plugin).use(visibleClipboard).use($prose(() => instance.suggestions.plugin())).use(instance.keymapPlugin).use(createDialect(Boolean(options.images || options.files), Boolean(options.wikiLinks), Boolean(options.files))).use(codeControlCtx).use(codeControlsPlugin(() => instance.viewport().rect)).use(tablePlugins).use(tableBlock).use(instance.changePlugin).use(instance.historyInputPlugin).use(history).use(clipboard).use(cursor).use(taskListPlugin).use(quoteBackspace).use(calloutEnter).use(literalEnter).use(literalReread).use(listItemBackspace).use(listItemShiftTab).use(nestedItemEnter).use(rejoinLists).use(movedListItems).use(textInputPolicy).use(events.copy ? codeCopyPlugin((text) => events.copy?.(text)) : []).use(placeholderPlugin).use(options.rendering?.codeHighlighting === false ? [] : (await import("./highlight-D6evOlOs.js")).highlightPlugin).use(options.rendering?.diagramPreview === false || !diagramsAvailable() ? [] : mermaidPreview((error) => instance.report(error))).use(selectionPlugin).use($prose(() => search())).use(instance.policyPlugin).use(options.wikiLinks ? wikiLinkView(options.wikiLinks, {
 			capture: () => instance.adapterCapture(),
 			active: () => instance.ready && !instance.destroyed && !instance.literalSurface,
 			labels: {
@@ -58786,6 +58853,7 @@ var InkKitEditor = class InkKitEditor {
 			"printableSnapshot",
 			"clipboardSnapshot",
 			"paste",
+			"cancelPendingImports",
 			"pasteAsPlainText",
 			"commandState",
 			"setEditable",

package/dist/chunks/{highlight-TSUdUlMi.js → highlight-D6evOlOs.js}

@@ -1,4 +1,4 @@
-import { a as Decoration, c as PluginKey, d as __toESM, i as $prose, o as DecorationSet, s as Plugin, u as __commonJSMin } from "./core-DkL-wDqy.js";
+import { a as Decoration, c as PluginKey, d as __toESM, i as $prose, o as DecorationSet, s as Plugin, u as __commonJSMin } from "./core-DrVCeBzK.js";
 //#region node_modules/.pnpm/highlight.js@11.11.2/node_modules/highlight.js/es/languages/arduino.js
 /** @type LanguageFn */
 function cPlusPlus(hljs) {

package/dist/core.d.ts

@@ -1,5 +1,5 @@
 export { InkKitEditor } from './editor.js';
 export type { EditorEvents, EditorOptions, TextInputPreferences, CommandState, EditingMode, CaretState, Mark, Block, FormatCommand, FormatOptions, KeyInput, ImageInsertion, ShortcutName, Keymap, } from './editor.js';
 export { InkKitError } from './types.js';
-export type { DocumentFormat, EditorLabels, Heading, TableCommand, TableOptions, BlockMoveDirection, DocumentContext, DocumentInput, DocumentSnapshot, DocumentVersion, EditorErrorCode, ImageAdapter, WikiLinkReference, WikiLinkAdapter, FileReference, ClientPoint, FileContext, FilePresentation, FileAdapter, CapturedImage, PortableImage, ClipboardInput, ClipboardOutput, ClipboardScope, ClipboardImage, ClipboardDiagram, PrintableDocument, PrintableWarning, TextRange, ReadableTextSnapshot, TextRect, ViewportInsets, ViewportOptions, ViewportSnapshot, } from './types.js';
+export type { DocumentFormat, EditorLabels, Heading, TableCommand, TableOptions, BlockMoveDirection, DocumentContext, DocumentInput, DocumentSnapshot, DocumentVersion, EditorErrorCode, ImageAdapter, ImageImportContext, WikiLinkReference, WikiLinkAdapter, FileReference, ClientPoint, FileContext, FilePresentation, FileAdapter, CapturedImage, PortableImage, ClipboardInput, ClipboardOutput, ClipboardScope, ClipboardImage, ClipboardDiagram, PrintableDocument, PrintableWarning, TextRange, ReadableTextSnapshot, TextRect, ViewportInsets, ViewportOptions, ViewportSnapshot, } from './types.js';
 export type { SlashMenuOptions, SlashCommandName, SlashCommand } from './types.js';

package/dist/core.js

@@ -1,2 +1,2 @@
-import { r as InkKitError, t as InkKitEditor } from "./chunks/core-DkL-wDqy.js";
+import { r as InkKitError, t as InkKitEditor } from "./chunks/core-DrVCeBzK.js";
 export { InkKitEditor, InkKitError };

package/dist/editor.d.ts

@@ -143,7 +143,7 @@ export interface EditorEvents {
 export declare const editorEvents: readonly ["changed", "commandStateChanged", "openLink", "copy", "error", "clipboard"];
 /**
  * The editor. Create it with `InkKitEditor.mount`, load a document, and read it back with
- * `snapshot`. The reference is https://github.com/aicayzer/inkkit/blob/main/docs/api.md.
+ * `snapshot`. The reference is https://inkkit.cyzr.me/reference/editor.
  */
 export declare class InkKitEditor {
     private readonly options;
@@ -321,6 +321,8 @@ export declare class InkKitEditor {
     /** Prepares the document or the selection for the native clipboard. Rejects with `stale-document`
      *  if the document changes first. */
     clipboardSnapshot(scope?: ClipboardScope, expectedGeneration?: number): Promise<ClipboardOutput>;
+    /** Cancels the pending image paste without changing the document or editability. */
+    cancelPendingImports(expectedGeneration?: number): void;
     /** Pastes content the host read from the native clipboard. Capture it once; don't read the
      *  clipboard again while this runs. */
     paste(input: ClipboardInput, expectedGeneration?: number): Promise<void>;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { n as registerMermaid, r as InkKitError, t as InkKitEditor } from "./chunks/core-DkL-wDqy.js";
+import { n as registerMermaid, r as InkKitError, t as InkKitEditor } from "./chunks/core-DrVCeBzK.js";
 //#region src/index.ts
 registerMermaid(async () => (await import("mermaid")).default);
 //#endregion

package/dist/style.css

@@ -81,7 +81,10 @@
   overflow-x: auto;
 }
 .inkkit-root .ProseMirror table {
-  border-collapse: collapse;
+  border-collapse: separate;
+  border-spacing: 0;
+  border: 1px solid var(--_inkkit-rule);
+  border-radius: var(--inkkit-table-radius, 4px);
   width: 100%;
 }
 .inkkit-root .ProseMirror td,
@@ -91,9 +94,39 @@
   min-width: calc(var(--inkkit-font-size, 15px) * 4);
   padding: calc(var(--inkkit-font-size, 15px) * 0.4)
     calc(var(--inkkit-font-size, 15px) * 0.6);
-  border: 1px solid var(--_inkkit-rule);
+  border: 0 solid var(--_inkkit-rule);
+  border-width: 0 1px 1px 0;
   vertical-align: top;
 }
+/* Round only the perimeter; keep controls and focus rings outside the table
+   unclipped, and leave every internal cell division square. */
+.inkkit-root .ProseMirror tr > :last-child {
+  border-right-width: 0;
+}
+.inkkit-root .ProseMirror tr:last-child > * {
+  border-bottom-width: 0;
+}
+.inkkit-root .ProseMirror tr:first-child > :first-child {
+  border-top-left-radius: max(0px, calc(var(--inkkit-table-radius, 4px) - 1px));
+}
+.inkkit-root .ProseMirror tr:first-child > :last-child {
+  border-top-right-radius: max(
+    0px,
+    calc(var(--inkkit-table-radius, 4px) - 1px)
+  );
+}
+.inkkit-root .ProseMirror tr:last-child > :first-child {
+  border-bottom-left-radius: max(
+    0px,
+    calc(var(--inkkit-table-radius, 4px) - 1px)
+  );
+}
+.inkkit-root .ProseMirror tr:last-child > :last-child {
+  border-bottom-right-radius: max(
+    0px,
+    calc(var(--inkkit-table-radius, 4px) - 1px)
+  );
+}
 .inkkit-root .ProseMirror th {
   background: var(--_inkkit-code-bg);
   font-weight: 600;
@@ -107,6 +140,7 @@
   position: absolute;
   inset: 0;
   z-index: 2;
+  border-radius: inherit;
   content: '';
   background: color-mix(in srgb, var(--_inkkit-accent) 25%, transparent);
   pointer-events: none;
@@ -154,9 +188,11 @@
   transform: translate(-50%, -50%);
   border-radius: 4px;
   box-shadow: 0 0 0 1px var(--_inkkit-rule);
-  cursor: grab;
   touch-action: none;
 }
+.inkkit-root .inkkit-table-controls .inkkit-table-grip:not(:disabled) {
+  cursor: grab;
+}
 .inkkit-root .inkkit-table-grip[data-inkkit-axis='column'] {
   width: 24px;
   height: 14px;
@@ -252,6 +288,10 @@
   outline-offset: 2px;
   border-radius: 6px;
 }
+/* A gap or node selection draws its own indicator, not a native text caret. */
+.inkkit-root .ProseMirror.ProseMirror-hideselection {
+  caret-color: transparent;
+}
 .inkkit-root .ProseMirror-gapcursor {
   display: none;
   pointer-events: none;
@@ -659,7 +699,11 @@
   width: var(--_inkkit-task-size);
   height: var(--_inkkit-task-size);
   box-sizing: border-box;
-  border: 1.5px solid color-mix(in srgb, CanvasText 35%, transparent);
+  border: 1.5px solid
+    var(
+      --inkkit-checkbox-border-color,
+      color-mix(in srgb, CanvasText 35%, transparent)
+    );
   border-radius: 4px;
   cursor: pointer;
 }
@@ -802,7 +846,7 @@
 }
 
 .inkkit-root .inkkit-reference-definition {
-  font-family: ui-monospace, monospace;
+  font-family: var(--_inkkit-mono);
   font-size: calc(var(--inkkit-font-size, 15px) * 0.8);
   opacity: 0.7;
 }
@@ -957,11 +1001,13 @@
   background: var(--inkkit-menu-background, light-dark(#fff, #252529));
   color: var(--inkkit-menu-text, CanvasText);
   box-shadow: var(--inkkit-menu-shadow, 0 4px 18px #0003);
-  font: 14px / 24px var(--inkkit-font-family, system-ui, sans-serif);
+  font: calc(var(--inkkit-font-size, 15px) * 14 / 15) /
+    calc(var(--inkkit-font-size, 15px) * 1.6)
+    var(--inkkit-font-family, system-ui, sans-serif);
 }
 .inkkit-root .inkkit-suggestions [role='option'] {
   box-sizing: border-box;
-  height: 32px;
+  min-height: 32px;
   display: flex;
   align-items: center;
   gap: 8px;
@@ -1021,8 +1067,9 @@
 }
 .inkkit-root .inkkit-code-language:focus-visible,
 .inkkit-root .inkkit-copy:focus-visible {
-  outline: 2px solid var(--_inkkit-accent);
-  outline-offset: 1px;
+  outline: var(--inkkit-focus-width, 2px) solid
+    var(--inkkit-focus-color, var(--_inkkit-accent));
+  outline-offset: var(--inkkit-focus-offset, 1px);
 }
 .inkkit-root .inkkit-code-language-menu {
   position: fixed;
@@ -1072,3 +1119,7 @@
 .inkkit-root .inkkit-code-language-list button[aria-pressed='true'] {
   background: color-mix(in srgb, CanvasText 8%, transparent);
 }
+
+.inkkit-root .milkdown-drop-indicator {
+  background: var(--inkkit-drop-indicator-color, var(--_inkkit-accent));
+}

package/dist/types.d.ts

@@ -51,6 +51,10 @@ export interface PortableImage {
     mimeType: string;
     filename?: string;
 }
+/** The document and cancellation signal for one image import. */
+export interface ImageImportContext extends DocumentContext {
+    signal: AbortSignal;
+}
 /** Stores, shows and exports the images a host owns. References stay opaque to the editor. */
 export interface ImageAdapter {
     /** The display URL for `reference`, or `undefined` when the image is unavailable. */
@@ -58,7 +62,7 @@ export interface ImageAdapter {
         url: string;
     } | undefined;
     /** Stores the bytes and returns the reference to write into the Markdown. */
-    importImage(input: CapturedImage, context: DocumentContext): Promise<{
+    importImage(input: CapturedImage, context: ImageImportContext): Promise<{
         reference: string;
     }>;
     /** The stored bytes and type of `reference`, for portable clipboard and print output. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aicayzer/inkkit",
-  "version": "0.1.7",
+  "version": "0.3.0",
   "description": "A preserving Markdown editor for offline web views and the web",
   "license": "MIT",
   "type": "module",