zigmini 0.8.0-beta.6 → 0.9.0-beta.1

package/web/app.js

@@ -1,4 +1,5 @@
 import { ClapDetector } from "./clap.js";
+import { renderDiagramMarkdown } from "./diagram.js";
 import { setupMemo } from "./memo.js";
 import { setupAutoCopy } from "./autocopy.js";
 import { setupWorkIdCopy } from "./workid.js";
@@ -28,6 +29,7 @@ import { hasTextSelection, panelShortcut } from "./shortcuts.js";
 import { decisionCommand, lastSentLabel, lastSentTooltip, nextLastSent } from "./lastsent.js";
 import { installTooltips } from "./tooltip.js";
 import { placeRow, unseenEvents } from "./chatorder.js";
+import { createTurnStats } from "./turn-stats.js";
 import { cardsOfDecision } from "./cardbind.js";
 import { createRecall, recallKey, resetRecall } from "./recall.js";
 import {
@@ -42,8 +44,10 @@ import {
 import { createEnrollment, NO_DEVICES_LINE, REVOKE_ARMED_LABEL, REVOKE_LABEL } from "./enroll.js";
 import { canUpdate, checkFailedLine, noticeLine, parseNotice, progressLine, questionGate, resultLine, UPDATE_CHECK_PATH, UPDATE_CONSENT_PATH, UPDATE_PATH, UPDATE_STATE_PATH, UPDATE_STATUS_PATH, updateStep, updateView } from "./update.js";
 import { createAppDownload } from "./app-download.js";
+import { setupNotificationSettings } from "./notifications.js";
 import { cleanRequest, cleanResultLine, GC_CLEAN_PATH, GC_PATH, gcView, selectAllState, selectAllTarget } from "./gc.js";
 import { manualFailureText, manualLinkLang, manualUrl, otherLang } from "./manual.js";
+import { canRestoreHeld, completeDetail, createAllowedValues, createSecurityInbox } from "./security-inbox.js";
 
 installTooltips(document, window);
 
@@ -60,6 +64,7 @@ const state = {
 // Work activity the gateway reports per conversation (snapshot + activity.updated). It drives the avatar only;
 // state.running stays the sole input of #interrupt, and history pages never write here.
 const activity = createActivity();
+const turnStats = createTurnStats();
 const HISTORY_PAGE = 100;
 // Loaded window of the current conversation's stored events (by seq), for resuming after a reconnect and paging back.
 let hist = { conv: null, oldest: null, newest: 0, hasMore: false, loading: false, seen: new Set() };
@@ -533,7 +538,7 @@ function systemLine(text, error = false) {
 
 function renderMarkdown(el, text) {
 	el.dataset.raw = text;
-	el.innerHTML = DOMPurify.sanitize(marked.parse(text, { gfm: true, breaks: true }));
+	renderDiagramMarkdown(el, text, marked, DOMPurify);
 	for (const a of el.querySelectorAll("a")) {
 		a.target = "_blank";
 		a.rel = "noopener noreferrer";
@@ -984,8 +989,12 @@ function renderEvent(e, fromHistory = false) {
 			}
 			const source = referenceSource(e);
 			if (source) markReferenceable(body.parentElement, source);
+			turnStats.accept(e, body);
 			break;
 		}
+		case "message.stats":
+			turnStats.accept(e);
+			break;
 		case "progress.update":
 			renderProgress(e);
 			break;
@@ -1096,6 +1105,7 @@ function rememberSent(e) {
 
 function clearMessages(conv) {
 	els.messages.innerHTML = "";
+	turnStats.reset(conv);
 	setLastSent(null);
 	recall.sent.length = 0;
 	resetRecall(recall.rec);
@@ -1104,6 +1114,7 @@ function clearMessages(conv) {
 	progressEls.clear();
 	resolvedSeen.clear();
 	hist = { conv, oldest: null, newest: 0, hasMore: false, loading: false, seen: new Set() };
+	renderSecuritySurfaces();
 }
 
 /** `resume`: after a reconnect, keep what is on screen and fetch only the events missed meanwhile. */
@@ -1241,7 +1252,7 @@ function recountPending(approvals) {
 }
 
 function onServerEvent(e, generation, statusGeneration) {
-	devLog("in", e);
+	if (e.type !== "security-check.held") devLog("in", e);
 	if (e.seq && e.conv === state.current && hist.conv === e.conv && hist.seen.has(e.seq)) return;
 	switch (e.type) {
 		case "state.snapshot":
@@ -1318,6 +1329,24 @@ function onServerEvent(e, generation, statusGeneration) {
 			showUpdateProgress(resultLine(e.data));
 			loadUpdateStatus();
 			return;
+		case "security-check.updated":
+			applySecurityBody(e.data);
+			return;
+		case "notifications.updated":
+			notificationSettings.updated(e.data);
+			return;
+		case "security-check.held":
+			showHeldCard(e.data);
+			return;
+		case "security-check.state":
+			securityInbox.merge(e.data);
+			return;
+		case "security-check.allowed-values.updated":
+			allowedValues.updated(e.data.revision);
+			return;
+		case "security-check.resolved":
+			void securityInbox.detail(e.data.id);
+			return;
 		case "voice.updated":
 			voice.reads += 1;
 			void applyVoiceSetting(voiceEnabledFrom(e.data));
@@ -1643,11 +1672,15 @@ function connect() {
 		$("head-avatar").classList.add("live");
 		renderActivity();
 		inbox.online = true;
+		void securityInbox.connect();
+		void allowedValues.connect();
 		renderInboxOnline();
 		send({ type: "hello", data: { client: "web-dev", version: "0.1.0" } });
 		sendWebPresence();
 		resendPendingReportSpeech();
 		void readVoiceSetting();
+		void readSecuritySetting();
+		void notificationSettings.connect();
 		void readVoiceInstall();
 		// Also after an update restarted the gateway: the new version and the update result show without a reload.
 		loadUpdateStatus();
@@ -1666,6 +1699,10 @@ function connect() {
 		state.sessionTransitions.clear();
 		renderSessionTransition();
 		inbox.online = false;
+		securityDetailsRequested.clear();
+		securityInbox.disconnect();
+		allowedValues.disconnect();
+		notificationSettings.disconnect();
 		historyRequests.length = 0;
 		renderInboxOnline();
 		setTimeout(connect, 1500);
@@ -2482,6 +2519,237 @@ async function setVoiceEnabled(enabled) {
 voiceButton.onclick = () => setVoiceEnabled(!voice.enabled);
 renderVoiceToggle();
 
+// ---- Improvement 165: the security check of every user message (settings toggle, blocked draft back in the composer) ----
+const SECURITY_CHECK_PATH = "/api/settings/security-check";
+const notificationSettings = setupNotificationSettings({ choice: $("notification-mode"), status: $("notification-status") });
+const security = { enabled: true, busy: false, read: 0 };
+const securityButton = $("toggle-security");
+
+function renderSecurityToggle() {
+	securityButton.textContent = security.enabled ? "보안검사 켜짐" : "보안검사 꺼짐";
+	securityButton.setAttribute("aria-pressed", String(security.enabled));
+	securityButton.classList.toggle("on", security.enabled);
+}
+
+function applySecurityBody(body) {
+	if (typeof body?.enabled === "boolean") security.enabled = body.enabled;
+	renderSecurityToggle();
+}
+
+async function readSecuritySetting() {
+	const request = ++security.read;
+	const socket = state.ws;
+	try {
+		const res = await fetch(SECURITY_CHECK_PATH, { cache: "no-store" });
+		const body = await res.json();
+		if (res.ok && request === security.read && socket === state.ws && inbox.online) applySecurityBody(body);
+	} catch {
+		// Offline: the reconnect reads it again.
+	}
+}
+
+async function setSecurityEnabled(enabled) {
+	if (security.busy) return;
+	security.busy = true;
+	try {
+		const res = await fetch(SECURITY_CHECK_PATH, { method: "PUT", headers: { "content-type": "application/json" }, body: JSON.stringify({ enabled }) });
+		const body = await res.json().catch(() => ({}));
+		if (!res.ok) throw new Error(body.error ?? String(res.status));
+		applySecurityBody(body);
+	} catch (err) {
+		systemLine(`보안검사 설정을 바꾸지 못했습니다: ${err instanceof Error ? err.message : err}`, true);
+	} finally {
+		security.busy = false;
+	}
+}
+
+/** A held text comes back into an empty composer of its conversation, so the user can fix it and send again. */
+function restoreDraft(conv, text) {
+	if (typeof text !== "string" || state.current !== conv || els.input.value !== "" || attach.items.length || refs.state.items.length) return;
+	els.input.value = text;
+	els.input.focus();
+}
+
+// Chat and inbox use the same opaque identity and dedicated sensitive detail.
+const heldCards = new Map();
+const securityDetailsRequested = new Set();
+const securityInbox = createSecurityInbox(fetch, () => renderSecuritySurfaces());
+const allowedValues = createAllowedValues(fetch, onAllowedValuesChanged);
+let allowedRemoval = undefined;
+
+function onAllowedValuesChanged() {
+	// A successful read of the new endpoint establishes support; full canonical detail still gates each approval.
+	securityInbox.supported(allowedValues.state.online && allowedValues.state.ready);
+	renderAllowedValues();
+}
+
+function showHeldCard(held) {
+	if (!securityInbox.merge(held)) return;
+	if (!decisionById(inbox.state, held.id)) void syncInbox({ reset: true });
+}
+
+function securityContents(id, surface) {
+	const entry = securityInbox.entries.get(id);
+	const view = securityInbox.view(id);
+	const held = entry.held;
+	const nodes = [make("div", "security-title", held.source === "answer" ? "답변 보안 확인" : "메시지 보안 확인")];
+	const list = make("ul", "security-list");
+	for (const occurrence of held.occurrences ?? []) {
+		const item = make("li");
+		item.append(make("span", "security-kind", occurrence.label), " ", make("code", "security-value", occurrence.canonicalValue ?? ""));
+		list.append(item);
+	}
+	nodes.push(list);
+	if (held.status === "pending") nodes.push(make("p", "security-question",
+		"승인하면 원본을 전송하고 위의 정확한 값 전체를 이 설치에 기억합니다. 같은 값은 다음 검사부터 허용합니다. 취소는 이번 전송만 중단하고 기존 작업은 멈추지 않습니다. " +
+		(held.source === "answer" ? "이번 답은 제출하지 않으며 원래 질문과 답변 작성 내용은 그대로 둡니다."
+			: "메시지는 같은 대화의 빈 입력창에만 복구하며 새 초안·첨부·참조는 바꾸지 않습니다.")));
+	const labels = { pending: "선택 대기", processing: "처리 중", sent: "전송 확인", cancelled: "이번 전송 취소", failed: "전송 실패", unconfirmed: "전송 결과 미확인 · 자동 재전송하지 않습니다" };
+	const remembered = view.remembered === null ? "값 기억 결과 미확인" : view.remembered ? "정확한 값 기억됨" : "값 기억 안 됨";
+	const reasons = { allowlist_persist_failed: "허용 값을 저장하지 못했습니다", state_persist_failed: "처리 기록을 확인하지 못했습니다",
+		payload_lost: "보류 원문이 없어 보내지 못했습니다", dispatch_failed: "전송을 시작하지 못했습니다",
+		dispatch_unknown: "전달 여부를 확인하지 못했습니다", original_decision_conflict: "원래 질문이 변경되어 이번 답을 보내지 않았습니다" };
+	const reason = held.errorCode ? reasons[held.errorCode] ?? "상태를 다시 확인하세요" : "";
+	const status = make("p", `security-status${view.status === "sent" ? " confirmed" : ""}`, `${labels[view.status]} · ${remembered}${reason ? ` · ${reason}` : ""}`);
+	status.setAttribute("role", "status");
+	nodes.push(status);
+	const actions = make("div", "security-actions inbox-actions");
+	const button = (label, cls, enabled, action) => {
+		const b = make("button", `text-btn ${cls}`, label);
+		b.type = "button"; b.disabled = !enabled; b.onclick = action; actions.append(b);
+	};
+	if (held.status === "pending" || view.status === "processing") {
+		button("원본 전송하고 값 기억", "security-approve", view.approve, () => void securityInbox.decide(id, true));
+		button("이번 전송 취소", "security-cancel", view.cancel, () => void securityInbox.decide(id, false));
+	}
+	if (view.check || (held.status === "pending" && !completeDetail(held))) {
+		button("상태 확인", "security-refresh", inbox.online && !entry.busy, () => void securityInbox.detail(id));
+	}
+	if (held.status === "pending" && !view.approve && !entry.busy && !entry.uncertain) {
+		nodes.push(make("p", "inbox-note", "게이트웨이의 기억 지원과 전체 값을 확인해야 승인할 수 있습니다."));
+	}
+	if (surface === "inbox" && (view.hide || view.cancel)) {
+		button("삭제", "inbox-dismiss-open", true, () => {
+			if (view.hide) { securityInbox.hide(id); renderInboxList(); return; }
+			inbox.dismissing.add(id);
+			renderInboxItem(decisionById(inbox.state, id)).querySelector(".inbox-dismiss-keep")?.focus();
+		});
+		if (inbox.dismissing.has(id)) {
+			const box = make("div", "inbox-dismiss mode-cancel");
+			box.append(make("p", "inbox-dismiss-text", "이번 전송만 취소합니다. 원래 질문과 답변 작성 내용은 남습니다."));
+			const confirm = make("button", "text-btn danger security-dismiss-confirm", "전송 취소하고 삭제");
+			confirm.disabled = !view.cancel;
+			confirm.onclick = async () => {
+				await securityInbox.decide(id, false);
+				if (securityInbox.view(id).status === "cancelled") securityInbox.hide(id);
+				inbox.dismissing.delete(id);
+				renderInboxList();
+			};
+			const keep = make("button", "text-btn inbox-dismiss-keep", "그대로 두기");
+			keep.onclick = () => { inbox.dismissing.delete(id); renderInboxItem(decisionById(inbox.state, id)); };
+			box.append(confirm, keep); nodes.push(box);
+		}
+	}
+	nodes.push(actions);
+	return nodes;
+}
+
+function renderSecuritySurfaces() {
+	for (const [id, entry] of securityInbox.entries) {
+		const held = entry.held;
+		if (held.source === "answer" && held.originalDecisionId) inbox.heldAnswers?.add(held.originalDecisionId);
+		let card = heldCards.get(id);
+		if (securityInbox.hidden.has(id)) {
+			card?.remove();
+			const row = inbox.nodes.get(id);
+			if (row) row.hidden = true;
+			continue;
+		}
+		if (held.conv === state.current || held.source === "answer") {
+			if (!card) {
+				card = make("div", "msg system security-card");
+				card.dataset.heldId = id;
+				card.setAttribute("role", "group");
+				card.setAttribute("aria-label", "보안 확인");
+				heldCards.set(id, card);
+			}
+			card.setAttribute("aria-busy", String(entry.busy));
+			card.replaceChildren(...securityContents(id, "chat"));
+			if (!card.isConnected) els.messages.append(card);
+		} else card?.remove();
+		const decision = decisionById(inbox.state, id);
+		if (decision && inbox.state.items.has(id)) renderInboxItem(decision);
+		if (!entry.restored && (held.status === "cancelled" || held.status === "failed")) {
+			if (canRestoreHeld(held, {
+				conv: state.current, text: els.input.value, images: attach.items.length, references: refs.state.items.length,
+			})) restoreDraft(held.conv, entry.draft);
+			entry.restored = true;
+		}
+	}
+}
+
+function renderSecurityInboxItem(decision) {
+	const id = decision.id;
+	let entry = securityInbox.entries.get(id);
+	if (!entry) {
+		// The generic row carries state only; complete canonical values come from the dedicated endpoint.
+		entry = { held: decision.security, busy: false, uncertain: false, restored: false };
+		securityInbox.entries.set(id, entry);
+	} else if (decision.security.revision > entry.held.revision) {
+		entry.held = { ...entry.held, ...decision.security };
+	}
+	const li = make("li", "inbox-item security-inbox-item");
+	li.dataset.id = id; li.dataset.heldId = id; li.dataset.revision = String(entry.held.revision);
+	li.hidden = securityInbox.hidden.has(id);
+	li.setAttribute("aria-busy", String(entry.busy));
+	li.append(...securityContents(id, "inbox"));
+	const previous = inbox.nodes.get(id);
+	if (previous?.isConnected) previous.replaceWith(li);
+	inbox.nodes.set(id, li);
+	if (entry.held.status === "pending" && !completeDetail(entry.held) && !securityDetailsRequested.has(id)) {
+		securityDetailsRequested.add(id);
+		void securityInbox.detail(id);
+	}
+	return li;
+}
+
+function renderAllowedValues() {
+	const model = allowedValues.state;
+	const list = $("security-allowed-list");
+	list.replaceChildren();
+	$("security-allowed-status").textContent = !model.online ? "연결이 끊겼습니다." : model.busy ? "삭제 처리 중…" : model.loading ? "불러오는 중…" : model.error || (model.ready && model.values.length === 0 ? "기억한 값이 없습니다." : "");
+	const locked = !model.online || model.loading || model.busy || !model.ready || Boolean(model.error);
+	$("security-allowed-refresh").disabled = !model.online || model.loading || model.busy;
+	$("security-allowed-clear").disabled = locked || model.values.length === 0;
+	for (const value of model.values) {
+		const row = make("li", "security-allowed-item");
+		row.dataset.allowedId = value.id;
+		const client = value.approvedBy.client === "android" ? "Android 앱" : "웹";
+		row.append(make("code", "security-value", value.value), make("div", "inbox-note", `${value.label} · ${dateTimeLabel(value.approvedAt)} · ${client}`));
+		const remove = make("button", "text-btn", "제거");
+		remove.disabled = locked;
+		remove.onclick = () => { allowedRemoval = value.id; renderAllowedValues(); $("security-allowed-keep").focus(); };
+		row.append(remove); list.append(row);
+	}
+	const confirm = $("security-allowed-confirm");
+	confirm.hidden = allowedRemoval === undefined;
+	$("security-allowed-remove").disabled = locked;
+}
+
+$("security-allowed-refresh").onclick = () => { allowedRemoval = undefined; void allowedValues.refresh(); };
+$("security-allowed-clear").onclick = () => { allowedRemoval = null; renderAllowedValues(); $("security-allowed-keep").focus(); };
+$("security-allowed-keep").onclick = () => { allowedRemoval = undefined; renderAllowedValues(); };
+$("security-allowed-remove").onclick = async () => {
+	if (allowedRemoval === undefined) return;
+	const id = allowedRemoval;
+	allowedRemoval = undefined;
+	await allowedValues.remove(id);
+	renderAllowedValues();
+};
+
+securityButton.onclick = () => setSecurityEnabled(!security.enabled);
+renderSecurityToggle();
+
 // ---- Todo 26: an npm install installs the voice servers on demand; the button is hidden everywhere else ----
 const voiceInstallButton = $("voice-install");
 
@@ -2522,6 +2790,7 @@ const memoController = setupMemo({ uploadImage, reportError: (message) => system
 // ---- 확인함: the server's durable decisions (GET /api/decisions), independent of the loaded chat page ----
 const inbox = {
 	state: createInbox(),
+	heldAnswers: new Set(),
 	open: false,
 	loading: false,
 	resync: false,
@@ -2627,15 +2896,21 @@ async function syncInbox({ reset = false, cursor = null } = {}) {
 		return;
 	}
 	const counterEpoch = reset ? beginPageReset(inbox.state) : inbox.state.counterEpoch;
+	const generation = decisionGeneration;
 	inbox.loading = true;
 	inbox.error = null;
 	renderInboxStatus();
 	try {
 		const page = await fetchDecisions(cursor);
+		if (generation !== decisionGeneration) return;
 		if (reset) {
 			dropSocketSubmissions(inbox.state);
 		}
 		applyPage(inbox.state, page, { reset, counterEpoch });
+		for (const decision of page.decisions) if (decision.security) {
+			securityInbox.merge(decision.security);
+			if (decision.security.status === "pending") void securityInbox.detail(decision.id);
+		}
 		renderInboxList();
 		for (const decision of inbox.state.items.values()) syncCard(decision);
 		if (reset) {
@@ -2725,6 +3000,7 @@ function renderInboxList() {
 		// The draft and note are shared with the chat card; a mounted card still answering the decision keeps them.
 		const shown = decisionById(inbox.state, id);
 		if (shown && isUnresolved(shown) && cardForDecision(id)) continue;
+		if (inbox.heldAnswers?.has(id)) continue;
 		inbox.forms.delete(id);
 		inbox.notes.delete(id);
 	}
@@ -2965,6 +3241,7 @@ function renderSourceContext(payload) {
 }
 
 function renderInboxItem(decision) {
+	if (decision.security) return renderSecurityInboxItem(decision);
 	const p = presentation(decision);
 	const payload = decision.payload && typeof decision.payload === "object" ? decision.payload : {};
 	const form = formFor(decision);
@@ -3175,6 +3452,12 @@ function settleSubmit(decision, result) {
 			noteConflict(inbox.state, decision, result.decision);
 			noteFor(id, "다른 곳에서 먼저 처리됐거나 질문이 바뀌었습니다. 최신 내용을 확인하고 다시 골라 주세요.", true);
 			break;
+		case "blocked":
+			// Improvement 165: the answer is held; the card decides. The typed answer stays in the form for a fix.
+			inbox.state.drafts.delete(id);
+			noteFor(id, `${result.message} 채팅의 보안검사 결과 카드에서 보내기 또는 보내지 않기를 고르세요.`, true);
+			if (result.held) showHeldCard(result.held);
+			break;
 		case "rejected":
 			inbox.state.drafts.delete(id);
 			if (result.decision) applyDecision(inbox.state, result.decision);
@@ -3204,6 +3487,10 @@ function onDecisionUpdated(data) {
 	const decision = data.decision;
 	if (!decision) return;
 	const result = applyUpdate(inbox.state, data);
+	if (decision.security) {
+		securityInbox.merge(decision.security);
+		if (decision.security.status === "pending") void securityInbox.detail(decision.id);
+	}
 	renderInboxBadge();
 	if (!result.changed) return;
 	if (endSocketSubmit(inbox.state, decision)) setCardBusy(originalActionId(decision), false);

package/web/decisions.d.ts

@@ -86,7 +86,7 @@ export function finishDetailLoad(
 ): DetailResult;
 export function failDetailLoad(inbox: Inbox, id: string, generation: number): boolean;
 export function presentation(decision: DecisionInfo): {
-	readonly kind: "terminal" | "submitted" | "live" | "resume" | "permission" | "recheck";
+	readonly kind: "terminal" | "submitted" | "live" | "resume" | "permission" | "recheck" | "security";
 	readonly mode: AnswerMode | null;
 	readonly form: boolean;
 	readonly recheck: boolean;

package/web/decisions.js

@@ -338,6 +338,7 @@ export function sourceContext(payload) {
 }
 
 export function presentation(decision) {
+	if (decision.security) return { kind: "security", mode: null, form: false, recheck: false, terminal: false };
 	const actions = decision.allowedActions ?? [];
 	const terminal = TERMINAL_WORK.has(decision.work?.status ?? "");
 	let kind = "terminal";
@@ -361,6 +362,7 @@ export function dismissMode(decision) {
 }
 
 export function canDismiss(decision) {
+	if (decision.security) return false;
 	return isUnresolved(decision) && decision.status !== "submitted";
 }
 
@@ -445,6 +447,7 @@ export function composeResponse(decision, form = {}) {
 
 /** An unchanged response replays its pending request verbatim, even after the current presentation mode changes. */
 export function buildRequest(inbox, decision, mode, response, newId = () => crypto.randomUUID()) {
+	if (decision.security) return null;
 	if (inbox.reviewRequired.has(decision.id)) return null;
 	const draft = inbox.drafts.get(decision.id);
 	const payload = response === undefined ? null : response;
@@ -473,6 +476,9 @@ export function interpretAnswerResponse(status, body) {
 	if (status === 409) return { kind: "conflict", decision, error };
 	if (status === 404) return { kind: "gone", error };
 	if (status === 400) return { kind: "rejected", decision, error };
+	if (status === 422 && error === "security_check_blocked") {
+		return { kind: "blocked", error, held: record(body.held) ? body.held : null, message: typeof body.message === "string" ? body.message : "보안검사에 걸려 보내지 않고 보류했습니다." };
+	}
 	return { kind: "unavailable", status, error };
 }
 

package/web/diagram.d.ts

@@ -0,0 +1,28 @@
+export interface DiagramNode {
+	readonly id: string;
+	readonly label: string;
+}
+export interface Diagram {
+	readonly version: 1;
+	readonly title?: string;
+	readonly nodes: readonly DiagramNode[];
+	readonly edges: readonly { readonly from: string; readonly to: string }[];
+}
+export interface MarkdownToken {
+	readonly type: string;
+	readonly raw: string;
+	readonly lang?: string;
+}
+export type MarkdownTokens = MarkdownToken[];
+export interface DiagramMarkdown {
+	lexer(text: string, options: { readonly gfm: boolean; readonly breaks: boolean }): MarkdownTokens;
+	parser(tokens: MarkdownTokens, options: { readonly gfm: boolean; readonly breaks: boolean }): string;
+}
+export type DiagramPart = { readonly html: string } | { readonly diagram: Diagram; readonly source: string };
+export function parseDiagram(body: string): Diagram | null;
+export function diagramLevels(diagram: Diagram): readonly (readonly DiagramNode[])[] | null;
+export function diagramParts(text: string, markdown: DiagramMarkdown): readonly DiagramPart[];
+export function createDiagram(doc: Document, diagram: Diagram, source: string): { readonly element: HTMLElement; dispose(): void };
+export function renderDiagramMarkdown(
+	el: HTMLElement, text: string, markdown: DiagramMarkdown, purify: { sanitize(html: string): string },
+): void;