@codeauradev/ngx-wind-editor 0.0.0-stage → 1.0.0

package/dist/fesm2022/codeauradev-ngx-wind-editor.mjs

@@ -0,0 +1,2596 @@
+import * as Y from "yjs";
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, ViewEncapsulation, afterNextRender, computed, effect, inject, input, model, signal, viewChild } from "@angular/core";
+const SLASH_ITEMS = [
+	{
+		id: "paragraph",
+		label: "Text",
+		hint: "Plain paragraph",
+		keys: "p text paragraph"
+	},
+	{
+		id: "h1",
+		label: "Heading 1",
+		hint: "Large title",
+		keys: "h1 heading title"
+	},
+	{
+		id: "h2",
+		label: "Heading 2",
+		hint: "Section",
+		keys: "h2 heading"
+	},
+	{
+		id: "h3",
+		label: "Heading 3",
+		hint: "Subsection",
+		keys: "h3 heading"
+	},
+	{
+		id: "bullet",
+		label: "Bullet list",
+		hint: "Unordered",
+		keys: "ul list bullet"
+	},
+	{
+		id: "ordered",
+		label: "Numbered list",
+		hint: "Ordered",
+		keys: "ol list number"
+	},
+	{
+		id: "quote",
+		label: "Quote",
+		hint: "Blockquote",
+		keys: "quote blockquote"
+	},
+	{
+		id: "code",
+		label: "Code",
+		hint: "Monospace block",
+		keys: "code pre"
+	},
+	{
+		id: "rule",
+		label: "Divider",
+		hint: "Horizontal rule",
+		keys: "hr rule divider line"
+	},
+	{
+		id: "image",
+		label: "Image",
+		hint: "From a URL",
+		keys: "img image picture"
+	}
+];
+function filterSlash(query) {
+	const needle = query.trim().toLowerCase();
+	if (!needle) return [...SLASH_ITEMS];
+	return SLASH_ITEMS.filter((item) => `${item.label} ${item.keys}`.toLowerCase().includes(needle));
+}
+const MARK_KEYS = [
+	"bold",
+	"italic",
+	"underline",
+	"strike",
+	"code",
+	"href"
+];
+function packAttrs(attrs) {
+	if (!attrs) return void 0;
+	const out = {};
+	if (attrs.bold) out.bold = true;
+	if (attrs.italic) out.italic = true;
+	if (attrs.underline) out.underline = true;
+	if (attrs.strike) out.strike = true;
+	if (attrs.code) out.code = true;
+	if (typeof attrs.href === "string" && attrs.href.length > 0) out.href = attrs.href;
+	return Object.keys(out).length > 0 ? out : void 0;
+}
+function attrsEqual(a, b) {
+	const left = packAttrs(a) ?? {};
+	const right = packAttrs(b) ?? {};
+	return MARK_KEYS.every((key) => left[key] === right[key]);
+}
+function mergeDelta(delta) {
+	const out = [];
+	for (const op of delta) {
+		if (!op.insert) continue;
+		const prev = out[out.length - 1];
+		if (prev && attrsEqual(prev.attributes, op.attributes)) prev.insert += op.insert;
+		else out.push({
+			insert: op.insert,
+			attributes: packAttrs(op.attributes)
+		});
+	}
+	return out;
+}
+function deltaLength(delta) {
+	return delta.reduce((sum, op) => sum + op.insert.length, 0);
+}
+function deltaToText(delta) {
+	return delta.map((op) => op.insert).join("");
+}
+function sliceDelta(delta, start, end) {
+	const out = [];
+	let pos = 0;
+	for (const op of delta) {
+		const len = op.insert.length;
+		const from = Math.max(start, pos);
+		const to = Math.min(end, pos + len);
+		if (to > from) out.push({
+			insert: op.insert.slice(from - pos, to - pos),
+			attributes: packAttrs(op.attributes)
+		});
+		pos += len;
+	}
+	return out;
+}
+function attrsAt(delta, index) {
+	if (index <= 0 || delta.length === 0) return {};
+	let pos = 0;
+	for (const op of delta) {
+		const len = op.insert.length;
+		if (index <= pos + len) return { ...packAttrs(op.attributes) ?? {} };
+		pos += len;
+	}
+	return { ...packAttrs(delta[delta.length - 1]?.attributes) ?? {} };
+}
+function commonEdges(prev, next) {
+	let start = 0;
+	const limit = Math.min(prev.length, next.length);
+	while (start < limit && prev[start] === next[start]) start += 1;
+	let prevEnd = prev.length;
+	let nextEnd = next.length;
+	while (prevEnd > start && nextEnd > start && prev[prevEnd - 1] === next[nextEnd - 1]) {
+		prevEnd -= 1;
+		nextEnd -= 1;
+	}
+	return {
+		start,
+		prevEnd,
+		nextEnd
+	};
+}
+function graphemeSegmenter() {
+	const intl = Intl;
+	if (typeof intl.Segmenter !== "function") return null;
+	return new intl.Segmenter(void 0, { granularity: "grapheme" });
+}
+function graphemeBefore(text, offset) {
+	if (offset <= 0) return 0;
+	const segmenter = graphemeSegmenter();
+	if (!segmenter) return offset - 1;
+	let last = 0;
+	for (const part of segmenter.segment(text.slice(0, offset))) last = part.index;
+	return last;
+}
+function graphemeAfter(text, offset) {
+	if (offset >= text.length) return text.length;
+	const segmenter = graphemeSegmenter();
+	if (!segmenter) return offset + 1;
+	return offset + (segmenter.segment(text.slice(offset))[Symbol.iterator]().next().value?.segment.length ?? 1);
+}
+const VOID = /* @__PURE__ */ new Set([
+	"area",
+	"base",
+	"br",
+	"col",
+	"embed",
+	"hr",
+	"img",
+	"input",
+	"link",
+	"meta",
+	"source",
+	"track",
+	"wbr"
+]);
+function safeUrl(value) {
+	const trimmed = value.trim();
+	if (!trimmed) return null;
+	if (trimmed.startsWith("/") || trimmed.startsWith("#") || trimmed.startsWith("./") || trimmed.startsWith("../")) return trimmed;
+	try {
+		const url = new URL(trimmed, "https://example.com");
+		if (url.protocol === "http:" || url.protocol === "https:" || url.protocol === "mailto:" || url.protocol === "tel:") return trimmed;
+	} catch {
+		return null;
+	}
+	return null;
+}
+function escapeText(value) {
+	return value.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
+}
+function escapeAttr(value) {
+	return escapeText(value).replace(/"/g, "\"");
+}
+function decodeEntity(body) {
+	const named = {
+		amp: "&",
+		lt: "<",
+		gt: ">",
+		quot: "\"",
+		apos: "'",
+		nbsp: "\xA0"
+	};
+	if (named[body]) return named[body];
+	if (body.startsWith("#x") || body.startsWith("#X")) {
+		const code = Number.parseInt(body.slice(2), 16);
+		return Number.isFinite(code) ? String.fromCodePoint(code) : `&${body};`;
+	}
+	if (body.startsWith("#")) {
+		const code = Number.parseInt(body.slice(1), 10);
+		return Number.isFinite(code) ? String.fromCodePoint(code) : `&${body};`;
+	}
+	return `&${body};`;
+}
+function decode(value) {
+	return value.replace(/&(#x?[0-9a-fA-F]+|[a-zA-Z]+);/g, (_, body) => decodeEntity(body));
+}
+function tokenize(html) {
+	const tokens = [];
+	let i = 0;
+	while (i < html.length) {
+		if (html[i] !== "<") {
+			const next = html.indexOf("<", i);
+			const raw = html.slice(i, next === -1 ? html.length : next);
+			tokens.push({
+				kind: "text",
+				value: decode(raw)
+			});
+			i = next === -1 ? html.length : next;
+			continue;
+		}
+		const next = html[i + 1];
+		if (!next || !/[a-zA-Z/!?]/.test(next)) {
+			tokens.push({
+				kind: "text",
+				value: "<"
+			});
+			i += 1;
+			continue;
+		}
+		if (html.startsWith("<!--", i)) {
+			const end = html.indexOf("-->", i + 4);
+			i = end === -1 ? html.length : end + 3;
+			continue;
+		}
+		const end = html.indexOf(">", i + 1);
+		if (end === -1) {
+			tokens.push({
+				kind: "text",
+				value: html.slice(i)
+			});
+			break;
+		}
+		const raw = html.slice(i + 1, end).trim();
+		i = end + 1;
+		if (!raw) continue;
+		if (raw.startsWith("/")) {
+			tokens.push({
+				kind: "close",
+				name: raw.slice(1).trim().split(/\s+/)[0]?.toLowerCase() ?? ""
+			});
+			continue;
+		}
+		if (raw.startsWith("!") || raw.startsWith("?")) continue;
+		const self = raw.endsWith("/");
+		const body = self ? raw.slice(0, -1).trim() : raw;
+		const name = body.split(/\s+/)[0]?.toLowerCase() ?? "";
+		const attrs = {};
+		const attrRe = /([^\s=/>]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'>]+)))?/g;
+		let match;
+		const rest = body.slice(name.length);
+		while (match = attrRe.exec(rest)) {
+			const key = match[1]?.toLowerCase();
+			if (!key) continue;
+			attrs[key] = decode(match[2] ?? match[3] ?? match[4] ?? "");
+		}
+		tokens.push({
+			kind: "open",
+			name,
+			attrs
+		});
+		if (self || VOID.has(name)) tokens.push({
+			kind: "close",
+			name
+		});
+	}
+	return tokens;
+}
+function pushText(draft, value, attrs) {
+	if (!value) return;
+	draft.delta.push({
+		insert: value,
+		attributes: packAttrs(attrs)
+	});
+}
+function finish(blocks, draft) {
+	if (!draft) return null;
+	let delta = mergeDelta(draft.delta);
+	if (draft.type !== "code") {
+		const text = deltaToText(delta).replace(/\u00a0/g, " ");
+		if (text.trim() === "" && !text.includes("\n")) delta = [];
+		else if (delta.length === 1 && delta[0] && !delta[0].attributes) {
+			const trimmed = delta[0].insert.replace(/^[ \t]+|[ \t]+$/g, "");
+			delta = trimmed ? [{ insert: trimmed }] : [];
+		}
+	}
+	blocks.push({
+		id: "",
+		type: draft.type,
+		level: draft.type === "heading" ? draft.level : 0,
+		src: draft.src,
+		alt: draft.alt,
+		delta: draft.type === "rule" || draft.type === "image" ? [] : delta
+	});
+	return null;
+}
+function parseHtml(html) {
+	const tokens = tokenize(html);
+	const blocks = [];
+	const marks = [];
+	const lists = [];
+	let quote = 0;
+	let pre = 0;
+	let ignore = 0;
+	let draft = null;
+	const attrs = () => marks.reduce((acc, mark) => ({
+		...acc,
+		...mark.attrs
+	}), {});
+	const popTag = (tag) => {
+		for (let index = marks.length - 1; index >= 0; index -= 1) if (marks[index]?.tag === tag) {
+			marks.splice(index, 1);
+			return;
+		}
+	};
+	const start = (type, extra) => {
+		draft = finish(blocks, draft);
+		draft = {
+			type,
+			level: extra?.level ?? (type === "heading" ? 1 : 0),
+			src: extra?.src ?? "",
+			alt: extra?.alt ?? "",
+			delta: []
+		};
+	};
+	for (const token of tokens) {
+		if (token.kind === "text") {
+			if (ignore) continue;
+			if (pre) {
+				if (!draft) start("code");
+				pushText(draft, token.value.replace(/^\n/, ""), {});
+				continue;
+			}
+			const collapsed = token.value.replace(/\u00a0/g, " ").replace(/[ \t\r\n]+/g, " ");
+			if (!draft) {
+				if (!collapsed.trim()) continue;
+				start(quote > 0 ? "blockquote" : lists.at(-1) ?? "paragraph");
+			}
+			if (!draft) continue;
+			pushText(draft, collapsed, attrs());
+			continue;
+		}
+		if (token.kind === "close") {
+			const name = token.name;
+			if (name === "script" || name === "style") ignore = Math.max(0, ignore - 1);
+			if (name === "strong" || name === "b") popTag(name);
+			if (name === "em" || name === "i") popTag(name);
+			if (name === "u") popTag(name);
+			if (name === "s" || name === "strike" || name === "del") popTag(name);
+			if (name === "code" && pre === 0) popTag("code");
+			if (name === "a") popTag("a");
+			if (name === "ul" || name === "ol") lists.pop();
+			if (name === "blockquote") quote = Math.max(0, quote - 1);
+			if (name === "pre") {
+				pre = Math.max(0, pre - 1);
+				draft = finish(blocks, draft);
+			}
+			if ([
+				"p",
+				"div",
+				"li",
+				"h1",
+				"h2",
+				"h3",
+				"h4",
+				"h5",
+				"h6",
+				"blockquote"
+			].includes(name) && pre === 0) draft = finish(blocks, draft);
+			continue;
+		}
+		const name = token.name;
+		if (name === "script" || name === "style") {
+			ignore += 1;
+			continue;
+		}
+		if (ignore) continue;
+		if (name === "strong" || name === "b") marks.push({
+			tag: name,
+			attrs: { bold: true }
+		});
+		else if (name === "em" || name === "i") marks.push({
+			tag: name,
+			attrs: { italic: true }
+		});
+		else if (name === "u") marks.push({
+			tag: "u",
+			attrs: { underline: true }
+		});
+		else if (name === "s" || name === "strike" || name === "del") marks.push({
+			tag: name,
+			attrs: { strike: true }
+		});
+		else if (name === "code" && pre === 0) marks.push({
+			tag: "code",
+			attrs: { code: true }
+		});
+		else if (name === "a") {
+			const href = safeUrl(token.attrs["href"] ?? "");
+			if (href) marks.push({
+				tag: "a",
+				attrs: { href }
+			});
+		} else if (name === "br") {
+			if (!draft) start(quote > 0 ? "blockquote" : lists.at(-1) ?? "paragraph");
+			if (draft && deltaToText(draft.delta).length > 0) pushText(draft, "\n", attrs());
+		} else if (name === "hr") {
+			draft = finish(blocks, draft);
+			blocks.push({
+				id: "",
+				type: "rule",
+				level: 0,
+				src: "",
+				alt: "",
+				delta: []
+			});
+		} else if (name === "img") {
+			const src = safeUrl(token.attrs["src"] ?? "");
+			if (src) {
+				draft = finish(blocks, draft);
+				blocks.push({
+					id: "",
+					type: "image",
+					level: 0,
+					src,
+					alt: token.attrs["alt"] ?? "",
+					delta: []
+				});
+			}
+		} else if (name === "ul") {
+			draft = finish(blocks, draft);
+			lists.push("bullet");
+		} else if (name === "ol") {
+			draft = finish(blocks, draft);
+			lists.push("ordered");
+		} else if (name === "blockquote") {
+			draft = finish(blocks, draft);
+			quote += 1;
+		} else if (name === "pre") {
+			draft = finish(blocks, draft);
+			pre += 1;
+			start("code");
+		} else if (/^h[1-6]$/.test(name)) start("heading", { level: Math.min(3, Number(name[1])) });
+		else if (name === "li") start(lists.at(-1) ?? "bullet");
+		else if (name === "p" || name === "div") {
+			if (pre > 0) continue;
+			if (draft && deltaToText(draft.delta).length > 0) draft = finish(blocks, draft);
+			if (!draft) start(quote > 0 ? "blockquote" : lists.at(-1) ?? "paragraph");
+		}
+	}
+	finish(blocks, draft);
+	return blocks;
+}
+function inlineHtml(delta, pre) {
+	let html = "";
+	for (const op of mergeDelta(delta)) {
+		let piece = escapeText(op.insert);
+		if (!pre) piece = piece.replace(/\n/g, "<br>");
+		const attrs = op.attributes ?? {};
+		if (attrs.code) piece = `<code>${piece}</code>`;
+		if (attrs.strike) piece = `<s>${piece}</s>`;
+		if (attrs.underline) piece = `<u>${piece}</u>`;
+		if (attrs.italic) piece = `<em>${piece}</em>`;
+		if (attrs.bold) piece = `<strong>${piece}</strong>`;
+		if (attrs.href) piece = `<a href="${escapeAttr(attrs.href)}">${piece}</a>`;
+		html += piece;
+	}
+	return html;
+}
+function blockHtml(block) {
+	if (block.type === "rule") return "<hr>";
+	if (block.type === "image") {
+		const alt = block.alt ? ` alt="${escapeAttr(block.alt)}"` : "";
+		return `<img src="${escapeAttr(block.src)}"${alt}>`;
+	}
+	if (block.type === "code") return `<pre><code>${inlineHtml(block.delta, true)}</code></pre>`;
+	const inner = inlineHtml(block.delta, false);
+	if (block.type === "heading") return `<h${Math.min(3, Math.max(1, block.level || 1))}>${inner}</h${Math.min(3, Math.max(1, block.level || 1))}>`;
+	if (block.type === "blockquote") return `<blockquote>${inner}</blockquote>`;
+	if (block.type === "bullet" || block.type === "ordered") return `<li>${inner}</li>`;
+	return `<p>${inner}</p>`;
+}
+function serializeBlocks(blocks) {
+	let html = "";
+	let i = 0;
+	while (i < blocks.length) {
+		const block = blocks[i];
+		if (!block) break;
+		if (block.type === "bullet" || block.type === "ordered") {
+			const tag = block.type === "bullet" ? "ul" : "ol";
+			html += `<${tag}>`;
+			while (i < blocks.length && blocks[i]?.type === block.type) {
+				html += blockHtml(blocks[i]);
+				i += 1;
+			}
+			html += `</${tag}>`;
+			continue;
+		}
+		html += blockHtml(block);
+		i += 1;
+	}
+	return html;
+}
+function plainText(blocks) {
+	return blocks.map((block) => {
+		if (block.type === "rule") return "";
+		if (block.type === "image") return block.alt || block.src;
+		return deltaToText(block.delta);
+	}).filter((line, index, all) => line.length > 0 || all.length === 1).join("\n");
+}
+function countWords(text) {
+	const trimmed = text.trim();
+	if (!trimmed) return 0;
+	return trimmed.split(/\s+/).length;
+}
+const BLOCK_TYPES = [
+	"paragraph",
+	"heading",
+	"blockquote",
+	"code",
+	"bullet",
+	"ordered",
+	"rule",
+	"image"
+];
+function isBlockType(value) {
+	return typeof value === "string" && BLOCK_TYPES.includes(value);
+}
+const BLOCKS = "blocks";
+let idSeq = 0;
+function nextId() {
+	idSeq += 1;
+	const rand = Math.random().toString(36).slice(2, 8);
+	return `b${idSeq.toString(36)}${rand}`;
+}
+function blocksOf(doc) {
+	return doc.getArray(BLOCKS);
+}
+function makeBlock(type, fields) {
+	const map = new Y.Map();
+	map.set("id", nextId());
+	map.set("type", type);
+	if (type === "heading") map.set("level", fields?.level ?? 1);
+	if (type === "image") {
+		map.set("src", fields?.src ?? "");
+		map.set("alt", fields?.alt ?? "");
+	}
+	if (type !== "rule" && type !== "image") {
+		const text = new Y.Text();
+		if (fields?.delta?.length) writeDelta(text, fields.delta, 0);
+		map.set("text", text);
+	}
+	return map;
+}
+function writeDelta(text, delta, at) {
+	let index = at;
+	for (const op of delta) {
+		if (!op.insert) continue;
+		text.insert(index, op.insert, packAttrs(op.attributes));
+		index += op.insert.length;
+	}
+}
+function readDelta(text) {
+	const ops = [];
+	for (const op of text.toDelta()) {
+		if (typeof op.insert !== "string" || op.insert.length === 0) continue;
+		ops.push({
+			insert: op.insert,
+			attributes: packAttrs(op.attributes)
+		});
+	}
+	return mergeDelta(ops);
+}
+function readMap(map, index) {
+	const rawType = map.get("type");
+	const type = isBlockType(rawType) ? rawType : "paragraph";
+	const text = map.get("text");
+	return {
+		map,
+		index,
+		id: String(map.get("id") ?? ""),
+		type,
+		level: Number(map.get("level") ?? 1) || 1,
+		text: text instanceof Y.Text ? text : null
+	};
+}
+function readBlocks(doc) {
+	const blocks = blocksOf(doc);
+	const out = [];
+	for (let i = 0; i < blocks.length; i += 1) {
+		const map = blocks.get(i);
+		const loc = readMap(map, i);
+		out.push({
+			id: loc.id,
+			type: loc.type,
+			level: loc.type === "heading" ? loc.level : 0,
+			src: String(map.get("src") ?? ""),
+			alt: String(map.get("alt") ?? ""),
+			delta: loc.text ? readDelta(loc.text) : []
+		});
+	}
+	return out;
+}
+function locate(doc, id) {
+	const blocks = blocksOf(doc);
+	for (let i = 0; i < blocks.length; i += 1) {
+		const loc = readMap(blocks.get(i), i);
+		if (loc.id === id) return loc;
+	}
+	return null;
+}
+function locateAt(doc, index) {
+	const blocks = blocksOf(doc);
+	if (index < 0 || index >= blocks.length) return null;
+	return readMap(blocks.get(index), index);
+}
+function cloneSelection(selection) {
+	return {
+		anchor: { ...selection.anchor },
+		head: { ...selection.head }
+	};
+}
+function collapsed(blockId, offset) {
+	return {
+		anchor: {
+			blockId,
+			offset
+		},
+		head: {
+			blockId,
+			offset
+		}
+	};
+}
+function boundsOf(doc, selection) {
+	const anchor = locate(doc, selection.anchor.blockId);
+	const head = locate(doc, selection.head.blockId);
+	if (!anchor || !head) return null;
+	const anchorFirst = anchor.index < head.index || anchor.index === head.index && selection.anchor.offset <= selection.head.offset;
+	return {
+		start: anchorFirst ? selection.anchor : selection.head,
+		end: anchorFirst ? selection.head : selection.anchor,
+		startIndex: anchorFirst ? anchor.index : head.index,
+		endIndex: anchorFirst ? head.index : anchor.index
+	};
+}
+function hasRange(doc, selection) {
+	const bounds = boundsOf(doc, selection);
+	if (!bounds) return false;
+	return bounds.start.blockId !== bounds.end.blockId || bounds.start.offset !== bounds.end.offset;
+}
+var WindSession = class {
+	constructor(doc) {
+		this.origin = {};
+		this.stored = null;
+		this.pendingBefore = null;
+		this.listeners = /* @__PURE__ */ new Set();
+		this.doc = doc;
+		if (blocksOf(doc).length === 0) doc.transact(() => {
+			if (blocksOf(doc).length === 0) blocksOf(doc).insert(0, [makeBlock("paragraph")]);
+		}, "seed");
+		const first = locateAt(doc, 0);
+		this.selection = collapsed(first?.id ?? "", 0);
+		this.undoManager = new Y.UndoManager(blocksOf(doc), {
+			trackedOrigins: /* @__PURE__ */ new Set([this.origin]),
+			captureTimeout: 500
+		});
+		this.undoManager.on("stack-item-added", (event) => {
+			const item = event.stackItem;
+			item.meta.set("before", this.pendingBefore);
+			item.meta.set("after", cloneSelection(this.selection));
+		});
+		this.undoManager.on("stack-item-popped", (event) => {
+			const item = event.stackItem;
+			const stored = event.type === "undo" ? item.meta.get("before") : item.meta.get("after");
+			if (isSelection(stored)) this.selection = cloneSelection(stored);
+			this.stored = null;
+			this.clampSelection();
+			this.emit(true);
+		});
+		blocksOf(doc).observeDeep((_events, transaction) => {
+			if (transaction.origin === this.origin) return;
+			this.clampSelection();
+			this.stored = null;
+			this.emit(true);
+		});
+	}
+	onChange(listener) {
+		this.listeners.add(listener);
+		return () => this.listeners.delete(listener);
+	}
+	get html() {
+		return serializeBlocks(readBlocks(this.doc));
+	}
+	get text() {
+		return plainText(readBlocks(this.doc));
+	}
+	get words() {
+		return countWords(this.text);
+	}
+	get canUndo() {
+		return this.undoManager.undoStack.length > 0;
+	}
+	get canRedo() {
+		return this.undoManager.redoStack.length > 0;
+	}
+	undo() {
+		this.undoManager.undo();
+	}
+	redo() {
+		this.undoManager.redo();
+	}
+	select(selection) {
+		this.selection = cloneSelection(selection);
+		this.stored = null;
+		this.clampSelection();
+		this.emit(false);
+	}
+	focusPoint(blockId, offset) {
+		this.select(collapsed(blockId, offset));
+	}
+	insertText(value) {
+		if (!value) return;
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) this.deleteRange();
+			const loc = this.current();
+			if (!loc) return;
+			if (!loc.text) {
+				const created = makeBlock("paragraph");
+				created.get("text").insert(0, value, packAttrs(this.typingAttrs(null, 0)));
+				blocksOf(this.doc).insert(loc.index + 1, [created]);
+				this.selection = collapsed(String(created.get("id")), value.length);
+				return;
+			}
+			const attrs = this.typingAttrs(loc.text, this.selection.head.offset);
+			loc.text.insert(this.selection.head.offset, value, packAttrs(attrs));
+			this.selection = collapsed(loc.id, this.selection.head.offset + value.length);
+		});
+	}
+	deleteBackward() {
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) {
+				this.deleteRange();
+				return;
+			}
+			const loc = this.current();
+			if (!loc) return;
+			if (!loc.text) {
+				blocksOf(this.doc).delete(loc.index, 1);
+				this.ensureBlock();
+				const next = locateAt(this.doc, Math.min(loc.index, blocksOf(this.doc).length - 1));
+				if (next) this.selection = collapsed(next.id, 0);
+				return;
+			}
+			const offset = this.selection.head.offset;
+			if (offset > 0) {
+				const from = graphemeBefore(loc.text.toString(), offset);
+				loc.text.delete(from, offset - from);
+				this.selection = collapsed(loc.id, from);
+				return;
+			}
+			if ((loc.type === "bullet" || loc.type === "ordered") && loc.text.length === 0) {
+				loc.map.set("type", "paragraph");
+				return;
+			}
+			if (loc.type !== "paragraph" && loc.type !== "bullet" && loc.type !== "ordered" && loc.index === 0) {
+				loc.map.set("type", "paragraph");
+				loc.map.delete("level");
+				return;
+			}
+			const prev = locateAt(this.doc, loc.index - 1);
+			if (!prev) return;
+			if (!prev.text) {
+				blocksOf(this.doc).delete(prev.index, 1);
+				this.selection = collapsed(loc.id, 0);
+				return;
+			}
+			if (!loc.text.length && (loc.type === "bullet" || loc.type === "ordered" || loc.type === "heading" || loc.type === "code" || loc.type === "blockquote")) {
+				loc.map.set("type", "paragraph");
+				return;
+			}
+			const join = prev.text.length;
+			writeDelta(prev.text, readDelta(loc.text), join);
+			blocksOf(this.doc).delete(loc.index, 1);
+			this.selection = collapsed(prev.id, join);
+		});
+	}
+	deleteForward() {
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) {
+				this.deleteRange();
+				return;
+			}
+			const loc = this.current();
+			if (!loc?.text) {
+				if (loc) this.deleteBackward();
+				return;
+			}
+			const offset = this.selection.head.offset;
+			const text = loc.text.toString();
+			if (offset < text.length) {
+				const to = graphemeAfter(text, offset);
+				loc.text.delete(offset, to - offset);
+				this.selection = collapsed(loc.id, offset);
+				return;
+			}
+			const next = locateAt(this.doc, loc.index + 1);
+			if (!next) return;
+			if (!next.text) {
+				blocksOf(this.doc).delete(next.index, 1);
+				return;
+			}
+			writeDelta(loc.text, readDelta(next.text), loc.text.length);
+			blocksOf(this.doc).delete(next.index, 1);
+			this.selection = collapsed(loc.id, offset);
+		});
+	}
+	split(mode) {
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) this.deleteRange();
+			const loc = this.current();
+			if (!loc) return;
+			if (!loc.text) {
+				const created = makeBlock("paragraph");
+				blocksOf(this.doc).insert(loc.index + 1, [created]);
+				this.selection = collapsed(String(created.get("id")), 0);
+				return;
+			}
+			if (mode === "hard" || mode === "enter" && loc.type === "code") {
+				const attrs = this.typingAttrs(loc.text, this.selection.head.offset);
+				loc.text.insert(this.selection.head.offset, "\n", packAttrs(attrs));
+				this.selection = collapsed(loc.id, this.selection.head.offset + 1);
+				return;
+			}
+			if (mode === "exit" || loc.type === "code" && mode === "enter") {
+				const created = makeBlock("paragraph");
+				blocksOf(this.doc).insert(loc.index + 1, [created]);
+				this.selection = collapsed(String(created.get("id")), 0);
+				return;
+			}
+			if ((loc.type === "bullet" || loc.type === "ordered") && loc.text.length === 0) {
+				loc.map.set("type", "paragraph");
+				this.selection = collapsed(loc.id, 0);
+				return;
+			}
+			const offset = this.selection.head.offset;
+			const delta = readDelta(loc.text);
+			const right = sliceDelta(delta, offset, deltaLength(delta));
+			if (offset < loc.text.length) loc.text.delete(offset, loc.text.length - offset);
+			const created = makeBlock(loc.type === "heading" ? "paragraph" : loc.type, {
+				level: loc.level,
+				delta: right
+			});
+			blocksOf(this.doc).insert(loc.index + 1, [created]);
+			this.selection = collapsed(String(created.get("id")), 0);
+			this.stored = null;
+		});
+	}
+	toggleMark(mark) {
+		this.transact(() => {
+			if (!hasRange(this.doc, this.selection)) {
+				const current = this.effectiveMarks();
+				this.stored = {
+					...current,
+					[mark]: !current[mark]
+				};
+				if (!this.stored[mark]) delete this.stored[mark];
+				return;
+			}
+			const enable = !this.rangeHas(mark);
+			this.formatRange({ [mark]: enable ? true : null });
+			this.stored = null;
+		});
+	}
+	setLink(href) {
+		const safe = href ? href : null;
+		this.transact(() => {
+			if (!hasRange(this.doc, this.selection)) {
+				const current = this.effectiveMarks();
+				this.stored = { ...current };
+				if (safe) this.stored.href = safe;
+				else delete this.stored.href;
+				return;
+			}
+			this.formatRange({ href: safe });
+			this.stored = null;
+		});
+	}
+	clearMarks() {
+		this.transact(() => {
+			if (!hasRange(this.doc, this.selection)) {
+				this.stored = {};
+				return;
+			}
+			this.formatRange({
+				bold: null,
+				italic: null,
+				underline: null,
+				strike: null,
+				code: null,
+				href: null
+			});
+			this.stored = null;
+		});
+	}
+	setBlockType(type, level = 1) {
+		this.transact(() => {
+			for (const loc of this.selectedBlocks()) {
+				if (!loc.text && type !== "rule" && type !== "image") {
+					const text = new Y.Text();
+					loc.map.set("text", text);
+				}
+				loc.map.set("type", type);
+				if (type === "heading") loc.map.set("level", level);
+				else loc.map.delete("level");
+				if (type === "rule" || type === "image") loc.map.delete("text");
+			}
+		});
+	}
+	insertDivider() {
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) this.deleteRange();
+			const loc = this.current();
+			if (!loc) return;
+			const empty = !!loc.text && loc.text.length === 0;
+			const rule = makeBlock("rule");
+			const para = makeBlock("paragraph");
+			if (empty) {
+				blocksOf(this.doc).delete(loc.index, 1);
+				blocksOf(this.doc).insert(loc.index, [rule, para]);
+				this.selection = collapsed(String(para.get("id")), 0);
+				return;
+			}
+			blocksOf(this.doc).insert(loc.index + 1, [rule, para]);
+			this.selection = collapsed(String(para.get("id")), 0);
+		});
+	}
+	insertImage(src, alt = "") {
+		this.transact(() => {
+			this.consumeSlash();
+			const loc = this.current();
+			if (!loc) return;
+			const image = makeBlock("image", {
+				src,
+				alt
+			});
+			const para = makeBlock("paragraph");
+			if (!!loc.text && loc.text.length === 0) {
+				blocksOf(this.doc).delete(loc.index, 1);
+				blocksOf(this.doc).insert(loc.index, [image, para]);
+			} else blocksOf(this.doc).insert(loc.index + 1, [image, para]);
+			this.selection = collapsed(String(para.get("id")), 0);
+		});
+	}
+	applySlash(choice) {
+		if (choice === "image") {
+			this.transact(() => this.consumeSlash());
+			return "image";
+		}
+		this.transact(() => {
+			this.consumeSlash();
+			if (choice === "rule") {
+				const loc = this.current();
+				if (loc?.text && loc.text.length === 0) {
+					const rule = makeBlock("rule");
+					const para = makeBlock("paragraph");
+					blocksOf(this.doc).delete(loc.index, 1);
+					blocksOf(this.doc).insert(loc.index, [rule, para]);
+					this.selection = collapsed(String(para.get("id")), 0);
+				}
+				return;
+			}
+			const type = choice === "h1" || choice === "h2" || choice === "h3" ? "heading" : choice === "quote" ? "blockquote" : choice === "paragraph" ? "paragraph" : choice;
+			const level = choice === "h1" ? 1 : choice === "h2" ? 2 : choice === "h3" ? 3 : 1;
+			const loc = this.current();
+			if (!loc) return;
+			loc.map.set("type", type);
+			if (type === "heading") loc.map.set("level", level);
+			else loc.map.delete("level");
+		});
+		return "applied";
+	}
+	paste(html, plain) {
+		const parsed = html?.trim() ? parseHtml(html) : [];
+		if (parsed.length === 1 && parsed[0] && parsed[0].type === "paragraph") {
+			this.transact(() => {
+				if (hasRange(this.doc, this.selection)) this.deleteRange();
+				const loc = this.ensureText();
+				if (!loc?.text) return;
+				writeDelta(loc.text, parsed[0].delta, this.selection.head.offset);
+				this.selection = collapsed(loc.id, this.selection.head.offset + deltaLength(parsed[0].delta));
+			});
+			return;
+		}
+		if (parsed.length > 0) {
+			this.insertParsed(parsed);
+			return;
+		}
+		if (!plain) return;
+		const lines = plain.replace(/\r\n/g, "\n").split("\n");
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) this.deleteRange();
+			const loc = this.ensureText();
+			if (!loc?.text) return;
+			loc.text.insert(this.selection.head.offset, lines[0] ?? "", packAttrs(this.typingAttrs(loc.text, this.selection.head.offset)));
+			let offset = this.selection.head.offset + (lines[0]?.length ?? 0);
+			this.selection = collapsed(loc.id, offset);
+			if (lines.length === 1) return;
+			const rest = lines.slice(1).map((line) => makeBlock("paragraph", { delta: line ? [{ insert: line }] : [] }));
+			const right = sliceDelta(readDelta(loc.text), offset, loc.text.length);
+			if (offset < loc.text.length) loc.text.delete(offset, loc.text.length - offset);
+			const tail = makeBlock(loc.type === "heading" ? "paragraph" : loc.type, {
+				level: loc.level,
+				delta: right
+			});
+			blocksOf(this.doc).insert(loc.index + 1, [...rest, tail]);
+			const last = rest[rest.length - 1];
+			this.selection = collapsed(String(last?.get("id") ?? loc.id), deltaLength(last ? readDelta(last.get("text")) : []));
+		});
+	}
+	replaceHtml(html) {
+		const parsed = parseHtml(html);
+		const blocks = parsed.length > 0 ? parsed : [{
+			id: "",
+			type: "paragraph",
+			level: 0,
+			src: "",
+			alt: "",
+			delta: []
+		}];
+		this.doc.transact(() => {
+			const list = blocksOf(this.doc);
+			if (list.length > 0) list.delete(0, list.length);
+			list.insert(0, blocks.map((block) => makeBlock(block.type, block)));
+		}, this.origin);
+		this.undoManager.clear();
+		const first = locateAt(this.doc, 0);
+		this.selection = collapsed(first?.id ?? "", 0);
+		this.stored = null;
+		this.emit(true);
+	}
+	reconcileText(blockId, next) {
+		const loc = locate(this.doc, blockId);
+		if (!loc?.text) return;
+		const prev = loc.text.toString();
+		if (prev === next) return;
+		const edges = commonEdges(prev, next);
+		const attrs = attrsAt(readDelta(loc.text), edges.start);
+		this.transact(() => {
+			const again = locate(this.doc, blockId);
+			if (!again?.text) return;
+			if (edges.prevEnd > edges.start) again.text.delete(edges.start, edges.prevEnd - edges.start);
+			const insert = next.slice(edges.start, edges.nextEnd);
+			if (insert) again.text.insert(edges.start, insert, packAttrs(this.stored ?? attrs));
+			this.selection = collapsed(blockId, edges.start + insert.length);
+		});
+	}
+	snapshot() {
+		const loc = this.current();
+		const marks = this.toolbarMarks();
+		return {
+			blockType: loc?.type ?? "paragraph",
+			level: loc?.type === "heading" ? loc.level : 0,
+			marks,
+			href: marks.href ?? null,
+			slash: this.slashQuery(),
+			canUndo: this.canUndo,
+			canRedo: this.canRedo
+		};
+	}
+	dismissSlash() {
+		this.transact(() => this.consumeSlash());
+	}
+	slashQuery() {
+		if (hasRange(this.doc, this.selection)) return null;
+		const loc = this.current();
+		if (!loc?.text) return null;
+		const text = loc.text.toString();
+		if (!/^\/[a-zA-Z0-9]*$/.test(text)) return null;
+		if (this.selection.head.offset !== text.length) return null;
+		return text.slice(1);
+	}
+	consumeSlash() {
+		const loc = this.current();
+		if (!loc?.text) return;
+		const text = loc.text.toString();
+		if (/^\/[a-zA-Z0-9]*$/.test(text)) {
+			loc.text.delete(0, text.length);
+			this.selection = collapsed(loc.id, 0);
+		}
+	}
+	typingAttrs(text, offset) {
+		if (this.stored) return { ...this.stored };
+		if (!text) return {};
+		return attrsAt(readDelta(text), offset);
+	}
+	effectiveMarks() {
+		const loc = this.current();
+		return this.typingAttrs(loc?.text ?? null, this.selection.head.offset);
+	}
+	toolbarMarks() {
+		if (!hasRange(this.doc, this.selection)) return this.effectiveMarks();
+		const marks = {
+			bold: true,
+			italic: true,
+			underline: true,
+			strike: true,
+			code: true
+		};
+		let href;
+		let any = false;
+		for (const slice of this.iterRange()) {
+			any = true;
+			for (const op of slice.delta) {
+				const attrs = op.attributes ?? {};
+				if (!attrs.bold) marks.bold = false;
+				if (!attrs.italic) marks.italic = false;
+				if (!attrs.underline) marks.underline = false;
+				if (!attrs.strike) marks.strike = false;
+				if (!attrs.code) marks.code = false;
+				const link = attrs.href ?? null;
+				if (href === void 0) href = link;
+				else if (href !== link) href = null;
+			}
+		}
+		if (!any) return {};
+		if (href) marks.href = href;
+		return marks;
+	}
+	rangeHas(mark) {
+		let any = false;
+		for (const slice of this.iterRange()) for (const op of slice.delta) {
+			any = true;
+			if (!op.attributes?.[mark]) return false;
+		}
+		return any;
+	}
+	formatRange(attrs) {
+		for (const slice of this.iterRange()) {
+			if (slice.delta.length === 0) continue;
+			const loc = locate(this.doc, slice.id);
+			if (!loc?.text) continue;
+			const length = deltaLength(slice.delta);
+			if (length > 0) loc.text.format(slice.from, length, attrs);
+		}
+	}
+	iterRange() {
+		const bounds = boundsOf(this.doc, this.selection);
+		if (!bounds) return [];
+		const out = [];
+		for (let index = bounds.startIndex; index <= bounds.endIndex; index += 1) {
+			const loc = locateAt(this.doc, index);
+			if (!loc?.text) continue;
+			const delta = readDelta(loc.text);
+			const from = index === bounds.startIndex ? bounds.start.offset : 0;
+			const to = index === bounds.endIndex ? bounds.end.offset : loc.text.length;
+			out.push({
+				id: loc.id,
+				from,
+				delta: sliceDelta(delta, from, to)
+			});
+		}
+		return out;
+	}
+	deleteRange() {
+		const bounds = boundsOf(this.doc, this.selection);
+		if (!bounds) return;
+		if (bounds.startIndex === bounds.endIndex) {
+			const loc = locateAt(this.doc, bounds.startIndex);
+			if (!loc) return;
+			if (!loc.text) {
+				blocksOf(this.doc).delete(loc.index, 1);
+				this.ensureBlock();
+				const next = locateAt(this.doc, Math.min(loc.index, blocksOf(this.doc).length - 1));
+				if (next) this.selection = collapsed(next.id, 0);
+				return;
+			}
+			loc.text.delete(bounds.start.offset, bounds.end.offset - bounds.start.offset);
+			this.selection = collapsed(loc.id, bounds.start.offset);
+			return;
+		}
+		const start = locateAt(this.doc, bounds.startIndex);
+		const end = locateAt(this.doc, bounds.endIndex);
+		if (!start || !end) return;
+		const endSurvives = !!end.text && bounds.end.offset < end.text.length;
+		if (end.text && bounds.end.offset > 0) end.text.delete(0, Math.min(bounds.end.offset, end.text.length));
+		const startSurvives = !!start.text;
+		if (start.text && bounds.start.offset < start.text.length) start.text.delete(bounds.start.offset, start.text.length - bounds.start.offset);
+		const from = startSurvives ? start.index + 1 : start.index;
+		const to = endSurvives ? end.index - 1 : end.index;
+		if (to >= from) blocksOf(this.doc).delete(from, to - from + 1);
+		const startNow = locate(this.doc, start.id);
+		const endNow = locate(this.doc, end.id);
+		if (startNow?.text && endNow?.text && startNow.id !== endNow.id) {
+			const join = startNow.text.length;
+			writeDelta(startNow.text, readDelta(endNow.text), join);
+			blocksOf(this.doc).delete(endNow.index, 1);
+			this.selection = collapsed(startNow.id, join);
+			return;
+		}
+		this.ensureBlock();
+		if (startNow) this.selection = collapsed(startNow.id, Math.min(bounds.start.offset, startNow.text?.length ?? 0));
+		else {
+			const fallback = locateAt(this.doc, Math.min(from, blocksOf(this.doc).length - 1));
+			if (fallback) this.selection = collapsed(fallback.id, 0);
+		}
+	}
+	insertParsed(parsed) {
+		this.transact(() => {
+			if (hasRange(this.doc, this.selection)) this.deleteRange();
+			const loc = this.current() ?? locateAt(this.doc, 0);
+			if (!loc) return;
+			const maps = parsed.map((block) => makeBlock(block.type, block));
+			if (loc.text && loc.text.length === 0) {
+				blocksOf(this.doc).delete(loc.index, 1);
+				blocksOf(this.doc).insert(loc.index, maps);
+			} else blocksOf(this.doc).insert(loc.index + 1, maps);
+			const last = maps[maps.length - 1];
+			const text = last?.get("text");
+			const offset = text instanceof Y.Text ? text.length : 0;
+			this.selection = collapsed(String(last?.get("id") ?? loc.id), offset);
+		});
+	}
+	selectedBlocks() {
+		const bounds = boundsOf(this.doc, this.selection);
+		if (!bounds) return [];
+		const out = [];
+		for (let index = bounds.startIndex; index <= bounds.endIndex; index += 1) {
+			const loc = locateAt(this.doc, index);
+			if (loc) out.push(loc);
+		}
+		return out;
+	}
+	ensureText() {
+		const loc = this.current();
+		if (!loc) return null;
+		if (loc.text) return loc;
+		const created = makeBlock("paragraph");
+		blocksOf(this.doc).insert(loc.index + 1, [created]);
+		const next = locate(this.doc, String(created.get("id")));
+		if (next) this.selection = collapsed(next.id, 0);
+		return next;
+	}
+	ensureBlock() {
+		if (blocksOf(this.doc).length === 0) blocksOf(this.doc).insert(0, [makeBlock("paragraph")]);
+	}
+	current() {
+		return locate(this.doc, this.selection.head.blockId) ?? locateAt(this.doc, 0);
+	}
+	clampSelection() {
+		if (blocksOf(this.doc).length === 0) return;
+		const clampPoint = (point) => {
+			const loc = locate(this.doc, point.blockId);
+			if (!loc) return {
+				blockId: locateAt(this.doc, 0)?.id ?? "",
+				offset: 0
+			};
+			const max = loc.text?.length ?? 0;
+			return {
+				blockId: loc.id,
+				offset: Math.max(0, Math.min(point.offset, max))
+			};
+		};
+		this.selection = {
+			anchor: clampPoint(this.selection.anchor),
+			head: clampPoint(this.selection.head)
+		};
+	}
+	transact(fn) {
+		this.pendingBefore = cloneSelection(this.selection);
+		this.doc.transact(fn, this.origin);
+		this.clampSelection();
+		this.emit(true);
+	}
+	emit(structural) {
+		for (const listener of this.listeners) listener(structural);
+	}
+};
+function isSelection(value) {
+	if (!value || typeof value !== "object") return false;
+	const selection = value;
+	return !!selection.anchor && !!selection.head && typeof selection.anchor.blockId === "string" && typeof selection.head.offset === "number";
+}
+function loadHtml(doc, html, origin = "seed") {
+	const parsed = parseHtml(html);
+	const blocks = parsed.length > 0 ? parsed : [{
+		id: "",
+		type: "paragraph",
+		level: 0,
+		src: "",
+		alt: "",
+		delta: []
+	}];
+	doc.transact(() => {
+		const list = blocksOf(doc);
+		if (list.length > 0) list.delete(0, list.length);
+		list.insert(0, blocks.map((block) => makeBlock(block.type, block)));
+	}, origin);
+}
+const WIND_TOOLS = [
+	"paragraph",
+	"h1",
+	"h2",
+	"bold",
+	"italic",
+	"underline",
+	"strike",
+	"code",
+	"link",
+	"bullet",
+	"ordered",
+	"quote",
+	"codeblock",
+	"rule",
+	"image",
+	"clear",
+	"undo",
+	"redo",
+	"source"
+];
+const WIND_TOOLBAR_PRESETS = {
+	full: WIND_TOOLS,
+	writing: [
+		"paragraph",
+		"h1",
+		"h2",
+		"bold",
+		"italic",
+		"link",
+		"bullet",
+		"ordered",
+		"quote",
+		"undo",
+		"redo"
+	],
+	basic: [
+		"bold",
+		"italic",
+		"underline",
+		"strike",
+		"link",
+		"bullet",
+		"ordered",
+		"undo",
+		"redo"
+	],
+	minimal: [
+		"bold",
+		"italic",
+		"link"
+	]
+};
+const KNOWN = new Set(WIND_TOOLS);
+function isWindTool(value) {
+	return KNOWN.has(value);
+}
+function isToolbarPreset(value) {
+	return value === "full" || value === "writing" || value === "basic" || value === "minimal";
+}
+function resolveToolbar(value) {
+	if (value == null) return [...WIND_TOOLS];
+	if (typeof value === "string") return [...isToolbarPreset(value) ? WIND_TOOLBAR_PRESETS[value] : WIND_TOOLS];
+	const picked = [];
+	for (const id of value) if (isWindTool(id) && !picked.includes(id)) picked.push(id);
+	return picked;
+}
+function mountWindSurface(host, options) {
+	const doc = new Y.Doc();
+	if (options.html) loadHtml(doc, options.html);
+	const session = new WindSession(doc);
+	const frame = host;
+	frame.classList.add("wind-frame");
+	const docEl = document.createElement("div");
+	docEl.className = "wind-doc";
+	docEl.setAttribute("role", "textbox");
+	docEl.setAttribute("aria-multiline", "true");
+	docEl.setAttribute("aria-label", "Document");
+	docEl.spellcheck = true;
+	frame.replaceChildren(docEl);
+	let placeholder = options.placeholder ?? "Write something…";
+	let readonly = options.readonly ?? false;
+	let silent = 0;
+	let composing = false;
+	let pending = false;
+	let destroyed = false;
+	const applyEditable = () => {
+		docEl.contentEditable = readonly ? "false" : "true";
+		frame.classList.toggle("is-readonly", readonly);
+	};
+	applyEditable();
+	const focused = () => docEl === document.activeElement || docEl.contains(document.activeElement);
+	const blockEl = (id) => docEl.querySelector(`[data-id="${CSS.escape(id)}"]`);
+	const pointToDom = (point) => {
+		const el = blockEl(point.blockId);
+		if (!el) return null;
+		if (el.dataset["atomic"] === "true") return {
+			node: el,
+			offset: 0
+		};
+		const walker = document.createTreeWalker(el, NodeFilter.SHOW_TEXT);
+		let left = point.offset;
+		let last = null;
+		while (walker.nextNode()) {
+			const text = walker.currentNode;
+			last = text;
+			if (left <= text.length) return {
+				node: text,
+				offset: left
+			};
+			left -= text.length;
+		}
+		if (last) return {
+			node: last,
+			offset: last.length
+		};
+		return {
+			node: el,
+			offset: 0
+		};
+	};
+	const pointFromNode = (node, offset) => {
+		const block = (node.nodeType === Node.ELEMENT_NODE ? node : node.parentElement)?.closest("[data-id]");
+		if (!block || !docEl.contains(block)) return null;
+		const blockId = block.dataset["id"] ?? "";
+		if (block.dataset["atomic"] === "true") return {
+			blockId,
+			offset: 0
+		};
+		const range = document.createRange();
+		range.selectNodeContents(block);
+		try {
+			range.setEnd(node, offset);
+		} catch {
+			return {
+				blockId,
+				offset: 0
+			};
+		}
+		return {
+			blockId,
+			offset: range.toString().length
+		};
+	};
+	const readSelection = () => {
+		const sel = document.getSelection();
+		if (!sel || sel.rangeCount === 0) return null;
+		if (!sel.anchorNode || !docEl.contains(sel.anchorNode)) return null;
+		const anchor = pointFromNode(sel.anchorNode, sel.anchorOffset);
+		const headNode = sel.focusNode ?? sel.anchorNode;
+		const head = pointFromNode(headNode, sel.focusOffset);
+		if (!anchor || !head) return null;
+		return {
+			anchor,
+			head
+		};
+	};
+	const samePoint = (a, b) => a.blockId === b.blockId && a.offset === b.offset;
+	const sameSelection = (a, b) => samePoint(a.anchor, b.anchor) && samePoint(a.head, b.head);
+	const applySelection = (selection) => {
+		const anchor = pointToDom(selection.anchor);
+		const head = pointToDom(selection.head);
+		if (!anchor || !head) return;
+		const sel = document.getSelection();
+		if (!sel) return;
+		silent += 1;
+		try {
+			sel.setBaseAndExtent(anchor.node, anchor.offset, head.node, head.offset);
+		} catch {}
+		queueMicrotask(() => {
+			silent = Math.max(0, silent - 1);
+		});
+	};
+	const fillInline = (el, delta) => {
+		el.replaceChildren();
+		if (deltaToText(delta).length === 0) {
+			el.append(document.createElement("br"));
+			return;
+		}
+		for (const op of delta) {
+			let node = document.createTextNode(op.insert);
+			const attrs = op.attributes ?? {};
+			const wrap = (tag, child) => {
+				const wrapped = document.createElement(tag);
+				wrapped.append(child);
+				return wrapped;
+			};
+			if (attrs.code) node = wrap("code", node);
+			if (attrs.strike) node = wrap("s", node);
+			if (attrs.underline) node = wrap("u", node);
+			if (attrs.italic) node = wrap("em", node);
+			if (attrs.bold) node = wrap("strong", node);
+			if (attrs.href) {
+				const href = safeUrl(attrs.href);
+				if (href) {
+					const link = document.createElement("a");
+					link.href = href;
+					link.rel = "noopener noreferrer";
+					link.append(node);
+					node = link;
+				}
+			}
+			el.append(node);
+		}
+	};
+	const bind = (el, block) => {
+		el.dataset["id"] = block.id;
+		el.dataset["type"] = block.type;
+	};
+	const draw = () => {
+		const blocks = readBlocks(session.doc);
+		const fragment = document.createDocumentFragment();
+		let index = 0;
+		while (index < blocks.length) {
+			const block = blocks[index];
+			if (!block) break;
+			if (block.type === "bullet" || block.type === "ordered") {
+				const list = document.createElement(block.type === "bullet" ? "ul" : "ol");
+				while (index < blocks.length && blocks[index]?.type === block.type) {
+					const item = blocks[index];
+					const li = document.createElement("li");
+					bind(li, item);
+					fillInline(li, item.delta);
+					list.append(li);
+					index += 1;
+				}
+				fragment.append(list);
+				continue;
+			}
+			if (block.type === "image") {
+				const figure = document.createElement("figure");
+				bind(figure, block);
+				figure.dataset["atomic"] = "true";
+				figure.contentEditable = "false";
+				const image = document.createElement("img");
+				const src = safeUrl(block.src);
+				if (src) image.src = src;
+				image.alt = block.alt;
+				image.draggable = false;
+				figure.append(image);
+				fragment.append(figure);
+				index += 1;
+				continue;
+			}
+			if (block.type === "rule") {
+				const rule = document.createElement("hr");
+				bind(rule, block);
+				rule.dataset["atomic"] = "true";
+				fragment.append(rule);
+				index += 1;
+				continue;
+			}
+			const tag = block.type === "heading" ? `h${Math.min(3, Math.max(1, block.level || 1))}` : block.type === "blockquote" ? "blockquote" : block.type === "code" ? "pre" : "p";
+			const el = document.createElement(tag);
+			bind(el, block);
+			if (block.type === "code") {
+				const code = document.createElement("code");
+				fillInline(code, block.delta);
+				el.append(code);
+			} else fillInline(el, block.delta);
+			if (block.type === "paragraph" && deltaToText(block.delta).length === 0) el.dataset["placeholder"] = placeholder;
+			fragment.append(el);
+			index += 1;
+		}
+		const empty = blocks.length === 1 && blocks[0]?.type === "paragraph" && deltaToText(blocks[0].delta).length === 0;
+		docEl.dataset["empty"] = empty ? "true" : "false";
+		docEl.replaceChildren(fragment);
+		const head = blockEl(session.selection.head.blockId);
+		if (head?.dataset["atomic"] === "true") head.classList.add("is-selected");
+		if (focused()) applySelection(session.selection);
+	};
+	const slashRect = () => {
+		if (session.snapshot().slash === null) return null;
+		const sel = document.getSelection();
+		if (!sel || sel.rangeCount === 0 || !sel.anchorNode || !docEl.contains(sel.anchorNode)) return null;
+		const rect = sel.getRangeAt(0).getBoundingClientRect();
+		return {
+			top: rect.bottom + 6,
+			left: Math.max(8, rect.left)
+		};
+	};
+	const publish = () => {
+		const snap = session.snapshot();
+		const text = readBlocks(session.doc).map((block) => block.type === "image" ? block.alt || block.src : block.type === "rule" ? "" : deltaToText(block.delta)).join("\n");
+		const words = text.trim() ? text.trim().split(/\s+/).length : 0;
+		options.onChange?.({
+			html: session.html,
+			text,
+			words,
+			characters: text.replace(/\s/g, "").length,
+			slashRect: slashRect(),
+			...snap
+		});
+	};
+	const redraw = (structural) => {
+		if (destroyed) return;
+		if (composing && structural) {
+			pending = true;
+			publish();
+			return;
+		}
+		if (structural) draw();
+		publish();
+	};
+	const unsession = session.onChange(redraw);
+	const reconcileDom = () => {
+		const elements = [...docEl.querySelectorAll("[data-id]")];
+		const model = readBlocks(session.doc);
+		if (elements.length !== model.length || model.some((block) => !elements.some((el) => el.dataset["id"] === block.id))) {
+			session.replaceHtml(docEl.innerHTML);
+			return;
+		}
+		for (const el of elements) {
+			const id = el.dataset["id"];
+			if (!id || el.dataset["atomic"] === "true") continue;
+			session.reconcileText(id, el.textContent ?? "");
+		}
+	};
+	docEl.addEventListener("beforeinput", (event) => {
+		if (readonly) {
+			event.preventDefault();
+			return;
+		}
+		if (composing) return;
+		const input = event;
+		const type = input.inputType;
+		if (type === "insertText") {
+			event.preventDefault();
+			session.insertText(input.data ?? "");
+		} else if (type === "insertParagraph") {
+			event.preventDefault();
+			session.split("enter");
+		} else if (type === "insertLineBreak") {
+			event.preventDefault();
+			session.split("hard");
+		} else if (type === "deleteContentBackward") {
+			event.preventDefault();
+			session.deleteBackward();
+		} else if (type === "deleteContentForward") {
+			event.preventDefault();
+			session.deleteForward();
+		} else if (type === "insertFromPaste" || type === "insertFromDrop") {
+			event.preventDefault();
+			const html = input.dataTransfer?.getData("text/html") || null;
+			const text = input.dataTransfer?.getData("text/plain") || input.data || null;
+			session.paste(html, text);
+		} else if (type === "historyUndo") {
+			event.preventDefault();
+			session.undo();
+		} else if (type === "historyRedo") {
+			event.preventDefault();
+			session.redo();
+		} else if (type === "formatBold") {
+			event.preventDefault();
+			session.toggleMark("bold");
+		} else if (type === "formatItalic") {
+			event.preventDefault();
+			session.toggleMark("italic");
+		} else if (type === "formatUnderline") {
+			event.preventDefault();
+			session.toggleMark("underline");
+		} else if (type === "formatStrikeThrough") {
+			event.preventDefault();
+			session.toggleMark("strike");
+		} else if (type.startsWith("delete")) {
+			event.preventDefault();
+			session.deleteBackward();
+		}
+	});
+	docEl.addEventListener("input", () => {
+		if (composing || silent > 0) return;
+		reconcileDom();
+	});
+	docEl.addEventListener("compositionstart", () => {
+		composing = true;
+	});
+	docEl.addEventListener("compositionend", () => {
+		composing = false;
+		const sel = readSelection();
+		if (sel) {
+			const el = blockEl(sel.head.blockId);
+			if (el && el.dataset["atomic"] !== "true") session.reconcileText(sel.head.blockId, el.textContent ?? "");
+		}
+		if (pending) {
+			pending = false;
+			draw();
+		}
+		publish();
+	});
+	const onSelectionChange = () => {
+		if (silent > 0 || composing || !focused()) return;
+		const next = readSelection();
+		if (!next || sameSelection(next, session.selection)) return;
+		session.select(next);
+	};
+	document.addEventListener("selectionchange", onSelectionChange);
+	docEl.addEventListener("keydown", (event) => {
+		if (options.interceptKey?.(event)) return;
+		if (readonly) return;
+		const meta = event.metaKey || event.ctrlKey;
+		const key = event.key.toLowerCase();
+		if (meta && key === "b") {
+			event.preventDefault();
+			session.toggleMark("bold");
+		} else if (meta && key === "i") {
+			event.preventDefault();
+			session.toggleMark("italic");
+		} else if (meta && key === "u") {
+			event.preventDefault();
+			session.toggleMark("underline");
+		} else if (meta && key === "e") {
+			event.preventDefault();
+			session.toggleMark("code");
+		} else if (meta && event.shiftKey && (key === "s" || key === "x")) {
+			event.preventDefault();
+			session.toggleMark("strike");
+		} else if (meta && key === "k") {
+			event.preventDefault();
+			options.onLink?.();
+		} else if (meta && key === "z") {
+			event.preventDefault();
+			if (event.shiftKey) session.redo();
+			else session.undo();
+		} else if (meta && key === "y") {
+			event.preventDefault();
+			session.redo();
+		} else if (event.key === "Enter" && meta) {
+			event.preventDefault();
+			session.split("exit");
+		} else if (event.key === "Tab") {
+			event.preventDefault();
+			session.insertText("  ");
+		}
+	});
+	docEl.addEventListener("mousedown", (event) => {
+		const atomic = (event.target instanceof Element ? event.target : null)?.closest("[data-atomic]");
+		if (!atomic || !docEl.contains(atomic)) return;
+		event.preventDefault();
+		const id = atomic.dataset["id"];
+		if (!id) return;
+		docEl.focus();
+		session.focusPoint(id, 0);
+		draw();
+	});
+	docEl.addEventListener("click", (event) => {
+		const link = (event.target instanceof Element ? event.target : null)?.closest("a");
+		if (!link || !docEl.contains(link)) return;
+		if (!event.metaKey && !event.ctrlKey) event.preventDefault();
+	});
+	docEl.addEventListener("cut", (event) => {
+		const sel = document.getSelection();
+		if (!sel || sel.isCollapsed || !sel.anchorNode || !docEl.contains(sel.anchorNode)) return;
+		event.preventDefault();
+		const range = sel.getRangeAt(0);
+		const holder = document.createElement("div");
+		holder.append(range.cloneContents());
+		event.clipboardData?.setData("text/plain", range.toString());
+		event.clipboardData?.setData("text/html", holder.innerHTML);
+		session.deleteBackward();
+	});
+	draw();
+	publish();
+	return {
+		session,
+		destroy() {
+			destroyed = true;
+			document.removeEventListener("selectionchange", onSelectionChange);
+			unsession();
+			frame.replaceChildren();
+		},
+		focus() {
+			docEl.focus();
+		},
+		exec(command) {
+			if (readonly && command.type !== "undo" && command.type !== "redo") return;
+			if (command.type === "mark") session.toggleMark(command.mark);
+			else if (command.type === "link") session.setLink(command.href);
+			else if (command.type === "clear") session.clearMarks();
+			else if (command.type === "block") session.setBlockType(command.block, command.level ?? 1);
+			else if (command.type === "divider") session.insertDivider();
+			else if (command.type === "image") session.insertImage(command.src, command.alt ?? "");
+			else if (command.type === "undo") session.undo();
+			else if (command.type === "redo") session.redo();
+			else if (command.type === "slash") session.applySlash(command.choice);
+			if (!readonly) docEl.focus();
+		},
+		setReadonly(value) {
+			readonly = value;
+			applyEditable();
+		},
+		setPlaceholder(value) {
+			placeholder = value;
+			draw();
+		},
+		setHtml(html) {
+			if (html === session.html) return;
+			session.replaceHtml(html);
+		},
+		getHtml() {
+			return session.html;
+		}
+	};
+}
+var WindIcon = class WindIcon {
+	constructor() {
+		this.name = input.required(...ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []);
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.3",
+			ngImport: i0,
+			type: WindIcon,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.3",
+			type: WindIcon,
+			isStandalone: true,
+			selector: "wind-icon",
+			inputs: { name: {
+				classPropertyName: "name",
+				publicName: "name",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			} },
+			ngImport: i0,
+			template: `
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+      @switch (name()) {
+        @case ('bold') { <path d="M6 4h8a4 4 0 0 1 0 8H6z" /><path d="M6 12h9a4 4 0 0 1 0 8H6z" /> }
+        @case ('italic') { <line x1="19" y1="4" x2="10" y2="4" /><line x1="14" y1="20" x2="5" y2="20" /><line x1="15" y1="4" x2="9" y2="20" /> }
+        @case ('underline') { <path d="M6 4v6a6 6 0 0 0 12 0V4" /><line x1="4" y1="20" x2="20" y2="20" /> }
+        @case ('strike') { <path d="M16 5c-.5-1.5-2-2.5-4-2.5-2.5 0-4 1.5-4 3.5 0 4 8 2 8 6 0 2-1.8 3.5-4.2 3.5-2.2 0-3.8-1.2-4.3-3" /><line x1="4" y1="12" x2="20" y2="12" /> }
+        @case ('code') { <path d="m8 8-4 4 4 4" /><path d="m16 8 4 4-4 4" /> }
+        @case ('link') { <path d="M10 13a5 5 0 0 0 7.5.5l2-2a5 5 0 0 0-7.1-7.1l-1.1 1.1" /><path d="M14 11a5 5 0 0 0-7.5-.5l-2 2a5 5 0 0 0 7.1 7.1l1.1-1.1" /> }
+        @case ('list') { <line x1="9" y1="6" x2="20" y2="6" /><line x1="9" y1="12" x2="20" y2="12" /><line x1="9" y1="18" x2="20" y2="18" /><circle cx="5" cy="6" r="1" fill="currentColor" stroke="none" /><circle cx="5" cy="12" r="1" fill="currentColor" stroke="none" /><circle cx="5" cy="18" r="1" fill="currentColor" stroke="none" /> }
+        @case ('ordered') { <line x1="10" y1="6" x2="21" y2="6" /><line x1="10" y1="12" x2="21" y2="12" /><line x1="10" y1="18" x2="21" y2="18" /><path d="M4 6h1v4" /><path d="M4 10h2" /><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1" /> }
+        @case ('quote') { <path d="M8 7H5a2 2 0 0 0-2 2v3h5V7z" /><path d="M17 7h-3a2 2 0 0 0-2 2v3h5V7z" /><path d="M8 12v2a3 3 0 0 1-3 3" /><path d="M17 12v2a3 3 0 0 1-3 3" /> }
+        @case ('block') { <rect x="4" y="4" width="16" height="16" rx="2" /><path d="m9 9-2 3 2 3" /><path d="m15 9 2 3-2 3" /> }
+        @case ('rule') { <line x1="4" y1="12" x2="20" y2="12" /> }
+        @case ('image') { <rect x="3" y="5" width="18" height="14" rx="2" /><circle cx="8.5" cy="10" r="1.5" /><path d="m21 16-5-4-9 8" /> }
+        @case ('undo') { <path d="M3 7v6h6" /><path d="M21 17a9 9 0 0 0-15-6.7L3 13" /> }
+        @case ('redo') { <path d="M21 7v6h-6" /><path d="M3 17a9 9 0 0 1 15-6.7L21 13" /> }
+        @case ('clear') { <path d="M4 7h16" /><path d="M9 7V5h6v2" /><path d="m8 7 1 12h6l1-12" /> }
+        @case ('source') { <path d="M8 6 3 12l5 6" /><path d="m16 6 5 6-5 6" /><path d="m14 4-4 16" /> }
+      }
+    </svg>
+  `,
+			isInline: true,
+			styles: [":host{display:inline-flex}svg{width:1rem;height:1rem;display:block}\n"],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: WindIcon,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "wind-icon",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: `
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+      @switch (name()) {
+        @case ('bold') { <path d="M6 4h8a4 4 0 0 1 0 8H6z" /><path d="M6 12h9a4 4 0 0 1 0 8H6z" /> }
+        @case ('italic') { <line x1="19" y1="4" x2="10" y2="4" /><line x1="14" y1="20" x2="5" y2="20" /><line x1="15" y1="4" x2="9" y2="20" /> }
+        @case ('underline') { <path d="M6 4v6a6 6 0 0 0 12 0V4" /><line x1="4" y1="20" x2="20" y2="20" /> }
+        @case ('strike') { <path d="M16 5c-.5-1.5-2-2.5-4-2.5-2.5 0-4 1.5-4 3.5 0 4 8 2 8 6 0 2-1.8 3.5-4.2 3.5-2.2 0-3.8-1.2-4.3-3" /><line x1="4" y1="12" x2="20" y2="12" /> }
+        @case ('code') { <path d="m8 8-4 4 4 4" /><path d="m16 8 4 4-4 4" /> }
+        @case ('link') { <path d="M10 13a5 5 0 0 0 7.5.5l2-2a5 5 0 0 0-7.1-7.1l-1.1 1.1" /><path d="M14 11a5 5 0 0 0-7.5-.5l-2 2a5 5 0 0 0 7.1 7.1l1.1-1.1" /> }
+        @case ('list') { <line x1="9" y1="6" x2="20" y2="6" /><line x1="9" y1="12" x2="20" y2="12" /><line x1="9" y1="18" x2="20" y2="18" /><circle cx="5" cy="6" r="1" fill="currentColor" stroke="none" /><circle cx="5" cy="12" r="1" fill="currentColor" stroke="none" /><circle cx="5" cy="18" r="1" fill="currentColor" stroke="none" /> }
+        @case ('ordered') { <line x1="10" y1="6" x2="21" y2="6" /><line x1="10" y1="12" x2="21" y2="12" /><line x1="10" y1="18" x2="21" y2="18" /><path d="M4 6h1v4" /><path d="M4 10h2" /><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1" /> }
+        @case ('quote') { <path d="M8 7H5a2 2 0 0 0-2 2v3h5V7z" /><path d="M17 7h-3a2 2 0 0 0-2 2v3h5V7z" /><path d="M8 12v2a3 3 0 0 1-3 3" /><path d="M17 12v2a3 3 0 0 1-3 3" /> }
+        @case ('block') { <rect x="4" y="4" width="16" height="16" rx="2" /><path d="m9 9-2 3 2 3" /><path d="m15 9 2 3-2 3" /> }
+        @case ('rule') { <line x1="4" y1="12" x2="20" y2="12" /> }
+        @case ('image') { <rect x="3" y="5" width="18" height="14" rx="2" /><circle cx="8.5" cy="10" r="1.5" /><path d="m21 16-5-4-9 8" /> }
+        @case ('undo') { <path d="M3 7v6h6" /><path d="M21 17a9 9 0 0 0-15-6.7L3 13" /> }
+        @case ('redo') { <path d="M21 7v6h-6" /><path d="M3 17a9 9 0 0 1 15-6.7L21 13" /> }
+        @case ('clear') { <path d="M4 7h16" /><path d="M9 7V5h6v2" /><path d="m8 7 1 12h6l1-12" /> }
+        @case ('source') { <path d="M8 6 3 12l5 6" /><path d="m16 6 5 6-5 6" /><path d="m14 4-4 16" /> }
+      }
+    </svg>
+  `,
+			styles: [":host{display:inline-flex}svg{width:1rem;height:1rem;display:block}\n"]
+		}]
+	}],
+	propDecorators: { name: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "name",
+			required: true
+		}]
+	}] }
+});
+const TOOLS = [
+	{
+		id: "paragraph",
+		label: "Text",
+		icon: "block"
+	},
+	{
+		id: "h1",
+		label: "Heading 1",
+		icon: "block"
+	},
+	{
+		id: "h2",
+		label: "Heading 2",
+		icon: "block"
+	},
+	{
+		id: "bold",
+		label: "Bold",
+		icon: "bold"
+	},
+	{
+		id: "italic",
+		label: "Italic",
+		icon: "italic"
+	},
+	{
+		id: "underline",
+		label: "Underline",
+		icon: "underline"
+	},
+	{
+		id: "strike",
+		label: "Strikethrough",
+		icon: "strike"
+	},
+	{
+		id: "code",
+		label: "Inline code",
+		icon: "code"
+	},
+	{
+		id: "link",
+		label: "Link",
+		icon: "link"
+	},
+	{
+		id: "bullet",
+		label: "Bullet list",
+		icon: "list"
+	},
+	{
+		id: "ordered",
+		label: "Numbered list",
+		icon: "ordered"
+	},
+	{
+		id: "quote",
+		label: "Quote",
+		icon: "quote"
+	},
+	{
+		id: "codeblock",
+		label: "Code block",
+		icon: "block"
+	},
+	{
+		id: "rule",
+		label: "Divider",
+		icon: "rule"
+	},
+	{
+		id: "image",
+		label: "Image",
+		icon: "image"
+	},
+	{
+		id: "clear",
+		label: "Clear formatting",
+		icon: "clear"
+	},
+	{
+		id: "undo",
+		label: "Undo",
+		icon: "undo"
+	},
+	{
+		id: "redo",
+		label: "Redo",
+		icon: "redo"
+	},
+	{
+		id: "source",
+		label: "HTML",
+		icon: "source"
+	}
+];
+var WindEditor = class WindEditor {
+	constructor() {
+		this.html = model("", ...ngDevMode ? [{ debugName: "html" }] : /* istanbul ignore next */ []);
+		this.placeholder = input("Write something…", ...ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []);
+		this.readOnly = input(false, {
+			...ngDevMode ? { debugName: "readOnly" } : /* istanbul ignore next */ {},
+			alias: "readonly"
+		});
+		this.showToolbar = input(true, ...ngDevMode ? [{ debugName: "showToolbar" }] : /* istanbul ignore next */ []);
+		this.toolbar = input("full", ...ngDevMode ? [{ debugName: "toolbar" }] : /* istanbul ignore next */ []);
+		this.tools = computed(() => {
+			const byId = new Map(TOOLS.map((tool) => [tool.id, tool]));
+			return resolveToolbar(this.toolbar()).flatMap((id) => {
+				const tool = byId.get(id);
+				return tool ? [tool] : [];
+			});
+		}, ...ngDevMode ? [{ debugName: "tools" }] : /* istanbul ignore next */ []);
+		this.change = signal(null, ...ngDevMode ? [{ debugName: "change" }] : /* istanbul ignore next */ []);
+		this.linkOpen = signal(false, ...ngDevMode ? [{ debugName: "linkOpen" }] : /* istanbul ignore next */ []);
+		this.linkDraft = signal("", ...ngDevMode ? [{ debugName: "linkDraft" }] : /* istanbul ignore next */ []);
+		this.imageOpen = signal(false, ...ngDevMode ? [{ debugName: "imageOpen" }] : /* istanbul ignore next */ []);
+		this.imageSrc = signal("", ...ngDevMode ? [{ debugName: "imageSrc" }] : /* istanbul ignore next */ []);
+		this.imageAlt = signal("", ...ngDevMode ? [{ debugName: "imageAlt" }] : /* istanbul ignore next */ []);
+		this.sourceOpen = signal(false, ...ngDevMode ? [{ debugName: "sourceOpen" }] : /* istanbul ignore next */ []);
+		this.sourceDraft = signal("", ...ngDevMode ? [{ debugName: "sourceDraft" }] : /* istanbul ignore next */ []);
+		this.slashIndex = signal(0, ...ngDevMode ? [{ debugName: "slashIndex" }] : /* istanbul ignore next */ []);
+		this.slashItems = computed(() => {
+			const query = this.change()?.slash;
+			return query === null || query === void 0 ? [] : filterSlash(query);
+		}, ...ngDevMode ? [{ debugName: "slashItems" }] : /* istanbul ignore next */ []);
+		this.surfaceRef = viewChild("surface", ...ngDevMode ? [{ debugName: "surfaceRef" }] : /* istanbul ignore next */ []);
+		this.destroyRef = inject(DestroyRef);
+		this.handle = null;
+		this.echo = "";
+		afterNextRender(() => this.attach());
+		effect(() => {
+			const value = this.placeholder();
+			this.handle?.setPlaceholder(value);
+		});
+		effect(() => {
+			this.handle?.setReadonly(this.readOnly());
+		});
+		effect(() => {
+			const html = this.html();
+			if (html !== this.echo) this.handle?.setHtml(html);
+		});
+		effect(() => {
+			this.slashItems();
+			this.slashIndex.set(0);
+		});
+		this.destroyRef.onDestroy(() => this.handle?.destroy());
+	}
+	pressed(id) {
+		const snap = this.change();
+		if (!snap) return false;
+		if (id === "bold" || id === "italic" || id === "underline" || id === "strike" || id === "code") return !!snap.marks[id];
+		if (id === "link") return !!snap.href;
+		if (id === "paragraph") return snap.blockType === "paragraph";
+		if (id === "h1") return snap.blockType === "heading" && snap.level === 1;
+		if (id === "h2") return snap.blockType === "heading" && snap.level === 2;
+		if (id === "bullet" || id === "ordered" || id === "quote") {
+			const type = id === "quote" ? "blockquote" : id;
+			return snap.blockType === type;
+		}
+		if (id === "codeblock") return snap.blockType === "code";
+		if (id === "source") return this.sourceOpen();
+		return false;
+	}
+	disabled(id) {
+		if (this.readOnly() && id !== "source") return true;
+		const snap = this.change();
+		if (id === "undo") return !snap?.canUndo;
+		if (id === "redo") return !snap?.canRedo;
+		return false;
+	}
+	run(id) {
+		const handle = this.handle;
+		if (!handle) return;
+		if (id === "bold" || id === "italic" || id === "underline" || id === "strike" || id === "code") handle.exec({
+			type: "mark",
+			mark: id
+		});
+		else if (id === "paragraph") handle.exec({
+			type: "block",
+			block: "paragraph"
+		});
+		else if (id === "h1") handle.exec({
+			type: "block",
+			block: "heading",
+			level: 1
+		});
+		else if (id === "h2") handle.exec({
+			type: "block",
+			block: "heading",
+			level: 2
+		});
+		else if (id === "bullet" || id === "ordered") handle.exec({
+			type: "block",
+			block: id
+		});
+		else if (id === "quote") handle.exec({
+			type: "block",
+			block: "blockquote"
+		});
+		else if (id === "codeblock") handle.exec({
+			type: "block",
+			block: "code"
+		});
+		else if (id === "rule") handle.exec({ type: "divider" });
+		else if (id === "clear") handle.exec({ type: "clear" });
+		else if (id === "undo") handle.exec({ type: "undo" });
+		else if (id === "redo") handle.exec({ type: "redo" });
+		else if (id === "link") {
+			this.linkDraft.set(this.change()?.href ?? "");
+			this.linkOpen.update((open) => !open);
+		} else if (id === "image") this.imageOpen.update((open) => !open);
+		else if (id === "source") {
+			this.sourceDraft.set(this.change()?.html ?? this.html());
+			this.sourceOpen.update((open) => !open);
+		}
+	}
+	pickSlash(item) {
+		if (item.id === "image") {
+			this.handle?.exec({
+				type: "slash",
+				choice: "image"
+			});
+			this.imageOpen.set(true);
+			return;
+		}
+		this.handle?.exec({
+			type: "slash",
+			choice: item.id
+		});
+	}
+	applyLink(event) {
+		event.preventDefault();
+		this.handle?.exec({
+			type: "link",
+			href: this.linkDraft().trim() || null
+		});
+		this.linkOpen.set(false);
+	}
+	clearLink() {
+		this.handle?.exec({
+			type: "link",
+			href: null
+		});
+		this.linkOpen.set(false);
+	}
+	applyImage(event) {
+		event.preventDefault();
+		const src = this.imageSrc().trim();
+		if (!src) return;
+		this.handle?.exec({
+			type: "image",
+			src,
+			alt: this.imageAlt().trim()
+		});
+		this.imageOpen.set(false);
+		this.imageSrc.set("");
+		this.imageAlt.set("");
+	}
+	applySource() {
+		this.echo = this.sourceDraft();
+		this.html.set(this.echo);
+		this.handle?.setHtml(this.echo);
+		this.sourceOpen.set(false);
+	}
+	onDraft(event, field) {
+		const value = event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement ? event.target.value : "";
+		if (field === "link") this.linkDraft.set(value);
+		else if (field === "src") this.imageSrc.set(value);
+		else if (field === "alt") this.imageAlt.set(value);
+		else this.sourceDraft.set(value);
+	}
+	attach() {
+		const element = this.surfaceRef()?.nativeElement;
+		if (!element || this.handle) return;
+		this.handle = mountWindSurface(element, {
+			html: this.html() || void 0,
+			placeholder: this.placeholder(),
+			readonly: this.readOnly(),
+			onChange: (change) => {
+				this.change.set(change);
+				if (change.html !== this.html()) {
+					this.echo = change.html;
+					this.html.set(change.html);
+				}
+			},
+			onLink: () => {
+				this.linkDraft.set(this.change()?.href ?? "");
+				this.linkOpen.set(true);
+			},
+			interceptKey: (event) => this.onKey(event)
+		});
+		this.echo = this.handle.getHtml();
+		if (this.echo !== this.html()) this.html.set(this.echo);
+	}
+	onKey(event) {
+		const items = this.slashItems();
+		if (items.length === 0) return false;
+		if (event.key === "ArrowDown") {
+			event.preventDefault();
+			this.slashIndex.update((index) => (index + 1) % items.length);
+			return true;
+		}
+		if (event.key === "ArrowUp") {
+			event.preventDefault();
+			this.slashIndex.update((index) => (index - 1 + items.length) % items.length);
+			return true;
+		}
+		if (event.key === "Enter" || event.key === "Tab") {
+			event.preventDefault();
+			const item = items[this.slashIndex()] ?? items[0];
+			if (item) this.pickSlash(item);
+			return true;
+		}
+		if (event.key === "Escape") {
+			event.preventDefault();
+			this.handle?.session.dismissSlash();
+			return true;
+		}
+		return false;
+	}
+	static {
+		this.ɵfac = i0.ɵɵngDeclareFactory({
+			minVersion: "12.0.0",
+			version: "22.2.3",
+			ngImport: i0,
+			type: WindEditor,
+			deps: [],
+			target: i0.ɵɵFactoryTarget.Component
+		});
+	}
+	static {
+		this.ɵcmp = i0.ɵɵngDeclareComponent({
+			minVersion: "17.0.0",
+			version: "22.2.3",
+			type: WindEditor,
+			isStandalone: true,
+			selector: "wind-editor",
+			inputs: {
+				html: {
+					classPropertyName: "html",
+					publicName: "html",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				placeholder: {
+					classPropertyName: "placeholder",
+					publicName: "placeholder",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				readOnly: {
+					classPropertyName: "readOnly",
+					publicName: "readonly",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				showToolbar: {
+					classPropertyName: "showToolbar",
+					publicName: "showToolbar",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
+				toolbar: {
+					classPropertyName: "toolbar",
+					publicName: "toolbar",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				}
+			},
+			outputs: { html: "htmlChange" },
+			host: { classAttribute: "wind-editor block min-w-0" },
+			viewQueries: [{
+				propertyName: "surfaceRef",
+				first: true,
+				predicate: ["surface"],
+				descendants: true,
+				isSignal: true
+			}],
+			ngImport: i0,
+			template: `
+    <div class="rounded-xl border border-stone-200 bg-white text-stone-900 shadow-sm dark:border-stone-800 dark:bg-stone-950 dark:text-stone-100">
+      @if (showToolbar() && tools().length > 0) {
+        <div class="flex gap-0.5 overflow-x-auto border-b border-stone-200 px-1.5 py-1.5 dark:border-stone-800" role="toolbar" aria-label="Formatting">
+          @for (tool of tools(); track tool.id) {
+            <button
+              type="button"
+              class="inline-flex h-9 shrink-0 items-center justify-center gap-1 rounded-md px-2 text-sm text-stone-600 hover:bg-stone-100 disabled:opacity-40 aria-pressed:bg-teal-700 aria-pressed:text-white dark:text-stone-300 dark:hover:bg-stone-900 dark:aria-pressed:bg-teal-600"
+              [attr.aria-label]="tool.label"
+              [attr.title]="tool.label"
+              [attr.aria-pressed]="pressed(tool.id)"
+              [disabled]="disabled(tool.id)"
+              (mousedown)="$event.preventDefault()"
+              (click)="run(tool.id)"
+            >
+              @if (tool.id === 'paragraph' || tool.id === 'h1' || tool.id === 'h2') {
+                <span class="px-0.5 text-xs font-semibold tracking-wide">{{ tool.id === 'paragraph' ? 'P' : tool.id.toUpperCase() }}</span>
+              } @else {
+                <wind-icon [name]="tool.icon" />
+              }
+            </button>
+          }
+        </div>
+      }
+
+      @if (linkOpen()) {
+        <form class="flex flex-wrap items-center gap-2 border-b border-stone-200 px-3 py-2 dark:border-stone-800" (submit)="applyLink($event)">
+          <label class="sr-only" for="wind-link">Link URL</label>
+          <input
+            id="wind-link"
+            class="h-9 min-w-0 flex-1 rounded-md border border-stone-300 bg-white px-2 text-sm outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900"
+            [value]="linkDraft()"
+            placeholder="https://"
+            (input)="onDraft($event, 'link')"
+          />
+          <button type="submit" class="h-9 rounded-md bg-teal-700 px-3 text-sm font-medium text-white">Apply</button>
+          <button type="button" class="h-9 rounded-md px-2 text-sm text-stone-600 dark:text-stone-300" (click)="clearLink()">Remove</button>
+        </form>
+      }
+
+      @if (imageOpen()) {
+        <form class="flex flex-wrap items-center gap-2 border-b border-stone-200 px-3 py-2 dark:border-stone-800" (submit)="applyImage($event)">
+          <input class="h-9 min-w-0 flex-1 rounded-md border border-stone-300 bg-white px-2 text-sm outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900" [value]="imageSrc()" placeholder="Image URL" (input)="onDraft($event, 'src')" />
+          <input class="h-9 w-36 rounded-md border border-stone-300 bg-white px-2 text-sm outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900" [value]="imageAlt()" placeholder="Alt text" (input)="onDraft($event, 'alt')" />
+          <button type="submit" class="h-9 rounded-md bg-teal-700 px-3 text-sm font-medium text-white">Insert</button>
+        </form>
+      }
+
+      <div class="relative min-h-48" #surface></div>
+
+      @if (slashItems().length > 0 && change()?.slashRect; as rect) {
+        <ul
+          class="fixed z-30 max-h-64 w-56 overflow-auto rounded-lg border border-stone-200 bg-white py-1 shadow-lg dark:border-stone-700 dark:bg-stone-900"
+          role="listbox"
+          [style.top.px]="rect.top"
+          [style.left.px]="rect.left"
+        >
+          @for (item of slashItems(); track item.id; let index = $index) {
+            <li>
+              <button
+                type="button"
+                class="flex w-full items-baseline justify-between gap-3 px-3 py-1.5 text-left text-sm hover:bg-stone-100 dark:hover:bg-stone-800"
+                [class.bg-teal-700]="index === slashIndex()"
+                [class.text-white]="index === slashIndex()"
+                role="option"
+                [attr.aria-selected]="index === slashIndex()"
+                (mousedown)="$event.preventDefault()"
+                (click)="pickSlash(item)"
+              >
+                <span>{{ item.label }}</span>
+                <span class="text-xs opacity-70">{{ item.hint }}</span>
+              </button>
+            </li>
+          }
+        </ul>
+      }
+
+      <footer class="flex items-center justify-between gap-3 border-t border-stone-200 px-3 py-1.5 text-xs text-stone-500 dark:border-stone-800 dark:text-stone-400">
+        <span>{{ change()?.words ?? 0 }} words</span>
+        <span class="text-stone-400">/ for blocks</span>
+      </footer>
+
+      @if (sourceOpen()) {
+        <div class="border-t border-stone-200 p-3 dark:border-stone-800">
+          <textarea
+            class="h-40 w-full resize-y rounded-md border border-stone-300 bg-stone-50 p-2 font-mono text-xs outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900"
+            [value]="sourceDraft()"
+            spellcheck="false"
+            aria-label="HTML source"
+            (input)="onDraft($event, 'source')"
+          ></textarea>
+          <button type="button" class="mt-2 h-9 rounded-md bg-stone-900 px-3 text-sm text-white dark:bg-stone-100 dark:text-stone-900" (click)="applySource()">Apply HTML</button>
+        </div>
+      }
+    </div>
+  `,
+			isInline: true,
+			styles: [":host{display:block;min-width:0}.wind-frame{position:relative;min-width:0}.wind-doc{min-height:12rem;padding:1rem 1.15rem 1.5rem;outline:none;color:var(--color-stone-900, #1c1917);font-family:var(--font-serif, Georgia, \"Iowan Old Style\", \"Palatino Linotype\", serif);font-size:1.0625rem;line-height:1.65;caret-color:var(--color-teal-700, #0f766e);overflow-wrap:anywhere}.wind-doc>*+*{margin-top:.75rem}.wind-doc p,.wind-doc h1,.wind-doc h2,.wind-doc h3,.wind-doc blockquote,.wind-doc pre,.wind-doc li{margin:0}.wind-doc h1,.wind-doc h2,.wind-doc h3{font-family:var(--font-sans, ui-sans-serif, system-ui, sans-serif);line-height:1.2;letter-spacing:-.03em;color:var(--color-stone-950, #0c0a09)}.wind-doc h1{font-size:1.875rem;font-weight:600}.wind-doc h2{font-size:1.5rem;font-weight:600}.wind-doc h3{font-size:1.25rem;font-weight:600}.wind-doc blockquote{border-left:2px solid var(--color-teal-700, #0f766e);padding-left:.9rem;color:var(--color-stone-600, #57534e)}.wind-doc ul,.wind-doc ol{margin:0;padding-left:1.25rem}.wind-doc li+li{margin-top:.25rem}.wind-doc pre{overflow-x:auto;border-radius:.6rem;background:color-mix(in oklab,var(--color-stone-900, #1c1917) 6%,transparent);padding:.8rem .9rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.875rem;line-height:1.55;white-space:pre-wrap}.wind-doc pre code{font:inherit;background:none;padding:0}.wind-doc a{color:var(--color-teal-800, #115e59);text-decoration:underline;text-underline-offset:2px}.wind-doc code{border-radius:.3rem;background:color-mix(in oklab,var(--color-stone-900, #1c1917) 8%,transparent);padding:.05em .3em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em}.wind-doc img{display:block;max-width:100%;border-radius:.6rem}.wind-doc figure{margin:0}.wind-doc hr{border:0;border-top:1px solid var(--color-stone-300, #d6d3d1);margin:.25rem 0}.wind-doc [data-atomic].is-selected{outline:2px solid var(--color-teal-700, #0f766e);outline-offset:3px;border-radius:.4rem}.wind-doc[data-empty=true]>p[data-placeholder]:before{content:attr(data-placeholder);float:left;height:0;pointer-events:none;color:var(--color-stone-400, #a8a29e)}.wind-carets{position:absolute;inset:0;pointer-events:none;overflow:hidden}.wind-caret,.wind-remote{position:absolute;pointer-events:none}.wind-caret{width:2px;background:var(--peer);border-radius:1px}.wind-caret i{position:absolute;top:-1.15rem;left:-1px;border-radius:.3rem;background:var(--peer);color:#fff;padding:.05rem .3rem;font-family:var(--font-sans, ui-sans-serif, system-ui, sans-serif);font-size:.65rem;font-style:normal;line-height:1.3;letter-spacing:.01em;white-space:nowrap}.wind-remote{background:color-mix(in oklab,var(--peer) 32%,transparent);border-radius:.1rem}.wind-frame.is-readonly .wind-doc{caret-color:transparent}.dark .wind-doc{color:var(--color-stone-100, #f5f5f4);caret-color:var(--color-teal-300, #5eead4)}.dark .wind-doc h1,.dark .wind-doc h2,.dark .wind-doc h3{color:var(--color-stone-50, #fafaf9)}.dark .wind-doc blockquote{color:var(--color-stone-400, #a8a29e)}.dark .wind-doc a{color:var(--color-teal-300, #5eead4)}.dark .wind-doc hr{border-top-color:var(--color-stone-700, #44403c)}.dark .wind-doc pre,.dark .wind-doc code{background:color-mix(in oklab,white 8%,transparent)}\n"],
+			dependencies: [{
+				kind: "component",
+				type: WindIcon,
+				selector: "wind-icon",
+				inputs: ["name"]
+			}],
+			changeDetection: i0.ChangeDetectionStrategy.OnPush,
+			encapsulation: i0.ViewEncapsulation.None
+		});
+	}
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: WindEditor,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "wind-editor",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			encapsulation: ViewEncapsulation.None,
+			imports: [WindIcon],
+			host: { class: "wind-editor block min-w-0" },
+			template: `
+    <div class="rounded-xl border border-stone-200 bg-white text-stone-900 shadow-sm dark:border-stone-800 dark:bg-stone-950 dark:text-stone-100">
+      @if (showToolbar() && tools().length > 0) {
+        <div class="flex gap-0.5 overflow-x-auto border-b border-stone-200 px-1.5 py-1.5 dark:border-stone-800" role="toolbar" aria-label="Formatting">
+          @for (tool of tools(); track tool.id) {
+            <button
+              type="button"
+              class="inline-flex h-9 shrink-0 items-center justify-center gap-1 rounded-md px-2 text-sm text-stone-600 hover:bg-stone-100 disabled:opacity-40 aria-pressed:bg-teal-700 aria-pressed:text-white dark:text-stone-300 dark:hover:bg-stone-900 dark:aria-pressed:bg-teal-600"
+              [attr.aria-label]="tool.label"
+              [attr.title]="tool.label"
+              [attr.aria-pressed]="pressed(tool.id)"
+              [disabled]="disabled(tool.id)"
+              (mousedown)="$event.preventDefault()"
+              (click)="run(tool.id)"
+            >
+              @if (tool.id === 'paragraph' || tool.id === 'h1' || tool.id === 'h2') {
+                <span class="px-0.5 text-xs font-semibold tracking-wide">{{ tool.id === 'paragraph' ? 'P' : tool.id.toUpperCase() }}</span>
+              } @else {
+                <wind-icon [name]="tool.icon" />
+              }
+            </button>
+          }
+        </div>
+      }
+
+      @if (linkOpen()) {
+        <form class="flex flex-wrap items-center gap-2 border-b border-stone-200 px-3 py-2 dark:border-stone-800" (submit)="applyLink($event)">
+          <label class="sr-only" for="wind-link">Link URL</label>
+          <input
+            id="wind-link"
+            class="h-9 min-w-0 flex-1 rounded-md border border-stone-300 bg-white px-2 text-sm outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900"
+            [value]="linkDraft()"
+            placeholder="https://"
+            (input)="onDraft($event, 'link')"
+          />
+          <button type="submit" class="h-9 rounded-md bg-teal-700 px-3 text-sm font-medium text-white">Apply</button>
+          <button type="button" class="h-9 rounded-md px-2 text-sm text-stone-600 dark:text-stone-300" (click)="clearLink()">Remove</button>
+        </form>
+      }
+
+      @if (imageOpen()) {
+        <form class="flex flex-wrap items-center gap-2 border-b border-stone-200 px-3 py-2 dark:border-stone-800" (submit)="applyImage($event)">
+          <input class="h-9 min-w-0 flex-1 rounded-md border border-stone-300 bg-white px-2 text-sm outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900" [value]="imageSrc()" placeholder="Image URL" (input)="onDraft($event, 'src')" />
+          <input class="h-9 w-36 rounded-md border border-stone-300 bg-white px-2 text-sm outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900" [value]="imageAlt()" placeholder="Alt text" (input)="onDraft($event, 'alt')" />
+          <button type="submit" class="h-9 rounded-md bg-teal-700 px-3 text-sm font-medium text-white">Insert</button>
+        </form>
+      }
+
+      <div class="relative min-h-48" #surface></div>
+
+      @if (slashItems().length > 0 && change()?.slashRect; as rect) {
+        <ul
+          class="fixed z-30 max-h-64 w-56 overflow-auto rounded-lg border border-stone-200 bg-white py-1 shadow-lg dark:border-stone-700 dark:bg-stone-900"
+          role="listbox"
+          [style.top.px]="rect.top"
+          [style.left.px]="rect.left"
+        >
+          @for (item of slashItems(); track item.id; let index = $index) {
+            <li>
+              <button
+                type="button"
+                class="flex w-full items-baseline justify-between gap-3 px-3 py-1.5 text-left text-sm hover:bg-stone-100 dark:hover:bg-stone-800"
+                [class.bg-teal-700]="index === slashIndex()"
+                [class.text-white]="index === slashIndex()"
+                role="option"
+                [attr.aria-selected]="index === slashIndex()"
+                (mousedown)="$event.preventDefault()"
+                (click)="pickSlash(item)"
+              >
+                <span>{{ item.label }}</span>
+                <span class="text-xs opacity-70">{{ item.hint }}</span>
+              </button>
+            </li>
+          }
+        </ul>
+      }
+
+      <footer class="flex items-center justify-between gap-3 border-t border-stone-200 px-3 py-1.5 text-xs text-stone-500 dark:border-stone-800 dark:text-stone-400">
+        <span>{{ change()?.words ?? 0 }} words</span>
+        <span class="text-stone-400">/ for blocks</span>
+      </footer>
+
+      @if (sourceOpen()) {
+        <div class="border-t border-stone-200 p-3 dark:border-stone-800">
+          <textarea
+            class="h-40 w-full resize-y rounded-md border border-stone-300 bg-stone-50 p-2 font-mono text-xs outline-none focus:border-teal-700 dark:border-stone-700 dark:bg-stone-900"
+            [value]="sourceDraft()"
+            spellcheck="false"
+            aria-label="HTML source"
+            (input)="onDraft($event, 'source')"
+          ></textarea>
+          <button type="button" class="mt-2 h-9 rounded-md bg-stone-900 px-3 text-sm text-white dark:bg-stone-100 dark:text-stone-900" (click)="applySource()">Apply HTML</button>
+        </div>
+      }
+    </div>
+  `,
+			styles: [":host{display:block;min-width:0}.wind-frame{position:relative;min-width:0}.wind-doc{min-height:12rem;padding:1rem 1.15rem 1.5rem;outline:none;color:var(--color-stone-900, #1c1917);font-family:var(--font-serif, Georgia, \"Iowan Old Style\", \"Palatino Linotype\", serif);font-size:1.0625rem;line-height:1.65;caret-color:var(--color-teal-700, #0f766e);overflow-wrap:anywhere}.wind-doc>*+*{margin-top:.75rem}.wind-doc p,.wind-doc h1,.wind-doc h2,.wind-doc h3,.wind-doc blockquote,.wind-doc pre,.wind-doc li{margin:0}.wind-doc h1,.wind-doc h2,.wind-doc h3{font-family:var(--font-sans, ui-sans-serif, system-ui, sans-serif);line-height:1.2;letter-spacing:-.03em;color:var(--color-stone-950, #0c0a09)}.wind-doc h1{font-size:1.875rem;font-weight:600}.wind-doc h2{font-size:1.5rem;font-weight:600}.wind-doc h3{font-size:1.25rem;font-weight:600}.wind-doc blockquote{border-left:2px solid var(--color-teal-700, #0f766e);padding-left:.9rem;color:var(--color-stone-600, #57534e)}.wind-doc ul,.wind-doc ol{margin:0;padding-left:1.25rem}.wind-doc li+li{margin-top:.25rem}.wind-doc pre{overflow-x:auto;border-radius:.6rem;background:color-mix(in oklab,var(--color-stone-900, #1c1917) 6%,transparent);padding:.8rem .9rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.875rem;line-height:1.55;white-space:pre-wrap}.wind-doc pre code{font:inherit;background:none;padding:0}.wind-doc a{color:var(--color-teal-800, #115e59);text-decoration:underline;text-underline-offset:2px}.wind-doc code{border-radius:.3rem;background:color-mix(in oklab,var(--color-stone-900, #1c1917) 8%,transparent);padding:.05em .3em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em}.wind-doc img{display:block;max-width:100%;border-radius:.6rem}.wind-doc figure{margin:0}.wind-doc hr{border:0;border-top:1px solid var(--color-stone-300, #d6d3d1);margin:.25rem 0}.wind-doc [data-atomic].is-selected{outline:2px solid var(--color-teal-700, #0f766e);outline-offset:3px;border-radius:.4rem}.wind-doc[data-empty=true]>p[data-placeholder]:before{content:attr(data-placeholder);float:left;height:0;pointer-events:none;color:var(--color-stone-400, #a8a29e)}.wind-carets{position:absolute;inset:0;pointer-events:none;overflow:hidden}.wind-caret,.wind-remote{position:absolute;pointer-events:none}.wind-caret{width:2px;background:var(--peer);border-radius:1px}.wind-caret i{position:absolute;top:-1.15rem;left:-1px;border-radius:.3rem;background:var(--peer);color:#fff;padding:.05rem .3rem;font-family:var(--font-sans, ui-sans-serif, system-ui, sans-serif);font-size:.65rem;font-style:normal;line-height:1.3;letter-spacing:.01em;white-space:nowrap}.wind-remote{background:color-mix(in oklab,var(--peer) 32%,transparent);border-radius:.1rem}.wind-frame.is-readonly .wind-doc{caret-color:transparent}.dark .wind-doc{color:var(--color-stone-100, #f5f5f4);caret-color:var(--color-teal-300, #5eead4)}.dark .wind-doc h1,.dark .wind-doc h2,.dark .wind-doc h3{color:var(--color-stone-50, #fafaf9)}.dark .wind-doc blockquote{color:var(--color-stone-400, #a8a29e)}.dark .wind-doc a{color:var(--color-teal-300, #5eead4)}.dark .wind-doc hr{border-top-color:var(--color-stone-700, #44403c)}.dark .wind-doc pre,.dark .wind-doc code{background:color-mix(in oklab,white 8%,transparent)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		html: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "html",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["htmlChange"]
+		}],
+		placeholder: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "placeholder",
+				required: false
+			}]
+		}],
+		readOnly: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "readonly",
+				required: false
+			}]
+		}],
+		showToolbar: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "showToolbar",
+				required: false
+			}]
+		}],
+		toolbar: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "toolbar",
+				required: false
+			}]
+		}],
+		surfaceRef: [{
+			type: i0.ViewChild,
+			args: ["surface", { isSignal: true }]
+		}]
+	}
+});
+export { SLASH_ITEMS, WIND_TOOLBAR_PRESETS, WIND_TOOLS, WindEditor, WindSession, filterSlash, isToolbarPreset, isWindTool, loadHtml, readBlocks, resolveToolbar };
+
+//# sourceMappingURL=codeauradev-ngx-wind-editor.mjs.map