@cocoar/vue-markdown-editor 2.9.0 → 2.10.0-beta.2

package/dist/index.js

@@ -1,39 +1,72 @@
-import { Fragment as e, Teleport as t, computed as n, createApp as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createVNode as c, defineComponent as l, h as u, inject as d, markRaw as f, normalizeClass as p, normalizeStyle as m, onBeforeUnmount as h, onMounted as g, openBlock as _, ref as v, renderList as y, shallowRef as b, unref as x, useId as ee, useTemplateRef as te, vModelText as S, vShow as C, watch as w, withDirectives as T, withModifiers as E } from "vue";
-import { Editor as ne, commandsCtx as D, defaultValueCtx as re, editorViewCtx as O, editorViewOptionsCtx as k, rootCtx as A } from "@milkdown/core";
-import { Milkdown as ie, MilkdownProvider as j, useEditor as M, useInstance as ae } from "@milkdown/vue";
-import { CoarCodeBlock as N, CoarIcon as P, CoarSelect as oe, CoarSidebar as se, CoarSidebarDivider as F, CoarSidebarGroup as ce, CoarSidebarItem as I, FORM_FIELD_INJECTION_KEY as L, menuPreset as le, useOverlay as ue } from "@cocoar/vue-ui";
-import { codeBlockSchema as R, commonmark as z, createCodeBlockCommand as de, insertHrCommand as fe, liftListItemCommand as B, sinkListItemCommand as pe, toggleEmphasisCommand as me, toggleInlineCodeCommand as he, toggleStrongCommand as ge, turnIntoTextCommand as _e, wrapInBlockquoteCommand as ve, wrapInBulletListCommand as ye, wrapInHeadingCommand as V, wrapInOrderedListCommand as be } from "@milkdown/preset-commonmark";
-import { Plugin as xe, TextSelection as Se } from "@milkdown/prose/state";
-import { $markSchema as Ce, $nodeSchema as we, $prose as Te, $remark as Ee, $view as De, replaceAll as H } from "@milkdown/utils";
-import { isColorSpanClose as Oe, parse as ke, parseColorSpanOpen as Ae, parseFrontmatter as je, sanitizeColor as U, serializeColorSpanClose as Me, serializeColorSpanOpen as Ne } from "@cocoar/vue-markdown-core";
-import { CoarMarkdown as Pe } from "@cocoar/vue-markdown";
-import { addColAfterCommand as Fe, addColBeforeCommand as Ie, addRowAfterCommand as Le, addRowBeforeCommand as Re, deleteSelectedCellsCommand as ze, gfm as Be, insertTableCommand as Ve, toggleStrikethroughCommand as He } from "@milkdown/preset-gfm";
-import { history as Ue, redoCommand as We, undoCommand as Ge } from "@milkdown/plugin-history";
-import { clipboard as Ke } from "@milkdown/plugin-clipboard";
-import { listener as qe, listenerCtx as Je } from "@milkdown/plugin-listener";
+import { Fragment as e, Teleport as t, computed as n, createApp as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, h as d, inject as f, markRaw as p, normalizeClass as m, normalizeStyle as h, onBeforeUnmount as ee, onMounted as g, openBlock as _, ref as v, renderList as y, shallowRef as b, toDisplayString as x, unref as S, useId as C, useTemplateRef as w, vModelText as T, vShow as E, watch as D, withCtx as O, withDirectives as k, withKeys as A, withModifiers as j } from "vue";
+import { Editor as te, commandsCtx as M, defaultValueCtx as N, editorViewCtx as P, editorViewOptionsCtx as F, rootCtx as I } from "@milkdown/core";
+import { Milkdown as ne, MilkdownProvider as re, useEditor as ie, useInstance as ae } from "@milkdown/vue";
+import { CoarButton as L, CoarCodeBlock as R, CoarContextMenu as oe, CoarFormField as z, CoarIcon as B, CoarMenuDivider as se, CoarMenuItem as ce, CoarSelect as V, CoarSidebar as le, CoarSidebarDivider as H, CoarSidebarGroup as ue, CoarSidebarItem as U, CoarTextInput as W, FORM_FIELD_INJECTION_KEY as G, menuPreset as K, useContextMenu as de, useDialog as fe, useOverlay as pe } from "@cocoar/vue-ui";
+import { codeBlockSchema as me, commonmark as q, createCodeBlockCommand as he, insertHrCommand as ge, insertImageCommand as _e, liftListItemCommand as ve, sinkListItemCommand as ye, toggleEmphasisCommand as be, toggleInlineCodeCommand as xe, toggleStrongCommand as Se, turnIntoTextCommand as Ce, wrapInBlockquoteCommand as we, wrapInBulletListCommand as Te, wrapInHeadingCommand as J, wrapInOrderedListCommand as Ee } from "@milkdown/preset-commonmark";
+import { Plugin as De, PluginKey as Oe, TextSelection as ke } from "@milkdown/prose/state";
+import { $markSchema as Ae, $nodeSchema as je, $prose as Me, $remark as Ne, $view as Pe, replaceAll as Fe } from "@milkdown/utils";
+import { isColorSpanClose as Ie, parse as Le, parseColorSpanOpen as Re, parseFrontmatter as ze, sanitizeColor as Y, serializeColorSpanClose as Be, serializeColorSpanOpen as Ve } from "@cocoar/vue-markdown-core";
+import { CoarMarkdown as He } from "@cocoar/vue-markdown";
+import { addColAfterCommand as Ue, addColBeforeCommand as We, addRowAfterCommand as Ge, addRowBeforeCommand as Ke, deleteSelectedCellsCommand as qe, gfm as Je, insertTableCommand as Ye, moveColCommand as Xe, moveRowCommand as Ze, selectColCommand as Qe, selectRowCommand as $e, selectTableCommand as et, toggleStrikethroughCommand as tt } from "@milkdown/preset-gfm";
+import { Decoration as nt, DecorationSet as rt } from "@milkdown/prose/view";
+import { history as it, redoCommand as at, undoCommand as ot } from "@milkdown/plugin-history";
+import { clipboard as st } from "@milkdown/plugin-clipboard";
+import { listener as ct, listenerCtx as lt } from "@milkdown/plugin-listener";
 //#region \0rolldown/runtime.js
-var Ye = Object.create, Xe = Object.defineProperty, Ze = Object.getOwnPropertyDescriptor, Qe = Object.getOwnPropertyNames, $e = Object.getPrototypeOf, et = Object.prototype.hasOwnProperty, tt = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), nt = (e, t, n, r) => {
-	if (t && typeof t == "object" || typeof t == "function") for (var i = Qe(t), a = 0, o = i.length, s; a < o; a++) s = i[a], !et.call(e, s) && s !== n && Xe(e, s, {
+var ut = Object.create, dt = Object.defineProperty, ft = Object.getOwnPropertyDescriptor, pt = Object.getOwnPropertyNames, mt = Object.getPrototypeOf, ht = Object.prototype.hasOwnProperty, gt = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), _t = (e, t, n, r) => {
+	if (t && typeof t == "object" || typeof t == "function") for (var i = pt(t), a = 0, o = i.length, s; a < o; a++) s = i[a], !ht.call(e, s) && s !== n && dt(e, s, {
 		get: ((e) => t[e]).bind(null, s),
-		enumerable: !(r = Ze(t, s)) || r.enumerable
+		enumerable: !(r = ft(t, s)) || r.enumerable
 	});
 	return e;
-}, rt = (e, t, n) => (n = e == null ? {} : Ye($e(e)), nt(t || !e || !e.__esModule ? Xe(n, "default", {
+}, vt = (e, t, n) => (n = e == null ? {} : ut(mt(e)), _t(t || !e || !e.__esModule ? dt(n, "default", {
 	value: e,
 	enumerable: !0
 }) : n, e));
 //#endregion
 //#region src/toolbar-helpers.ts
-function it(e, t) {
+function yt(e, t) {
+	switch (e) {
+		case "table":
+		case "tableOps":
+		case "taskList":
+		case "strikethrough": return t.gfm;
+		case "textColor": return t.textColor;
+		default: return !0;
+	}
+}
+function bt(e, t) {
 	return t === void 0 ? !0 : "has" in t ? t.has(e) : t.includes(e);
 }
-function at(e) {
+function xt(e) {
 	let { target: t, inBulletList: n, inOrderedList: r } = e;
 	return (t === "bullet_list" ? n : r) ? "lift" : (t === "bullet_list" ? r : n) ? "switch" : "wrap";
 }
 //#endregion
+//#region src/flavor.ts
+var St = {
+	commonmark: {
+		gfm: !1,
+		textColor: !1
+	},
+	gfm: {
+		gfm: !0,
+		textColor: !1
+	},
+	cocoar: {
+		gfm: !0,
+		textColor: !0
+	}
+};
+function Ct(e) {
+	return e === void 0 ? { ...St.cocoar } : typeof e == "string" ? { ...St[e] ?? St.cocoar } : {
+		gfm: e.gfm ?? !1,
+		textColor: e.textColor ?? !1
+	};
+}
+//#endregion
 //#region src/code-block-view/CodeBlockShell.vue?vue&type=script&setup=true&lang.ts
-var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" }, ct = { class: "coar-md-code-lang-row" }, lt = /* @__PURE__ */ l({
+var wt = { class: "coar-md-code-render" }, Tt = { class: "coar-md-code-edit" }, Et = { class: "coar-md-code-lang-row" }, Dt = /* @__PURE__ */ u({
 	__name: "CodeBlockShell",
 	props: {
 		text: {},
@@ -76,13 +109,13 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 				value: "bash",
 				label: "Bash"
 			}
-		], a = te("contentMount");
-		return w([a, () => n.contentDOM], ([e, t]) => {
+		], a = w("contentMount");
+		return D([a, () => n.contentDOM], ([e, t]) => {
 			e && t && t.parentElement !== e && e.appendChild(t);
 		}, {
 			immediate: !0,
 			flush: "post"
-		}), (t, n) => (_(), o("div", { class: p(["coar-md-code-host", { "coar-md-code-host--editing": e.editing }]) }, [T(s("div", ot, [c(x(N), {
+		}), (t, n) => (_(), o("div", { class: m(["coar-md-code-host", { "coar-md-code-host--editing": e.editing }]) }, [k(s("div", wt, [l(S(R), {
 			code: e.text,
 			language: e.language || "text",
 			collapsible: !1,
@@ -91,11 +124,11 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 			class: "coar-md-code-edit-btn",
 			type: "button",
 			title: "Edit code block",
-			onMousedown: n[0] ||= E((e) => r("enterEdit"), ["prevent"])
-		}, [c(x(P), {
+			onMousedown: n[0] ||= j((e) => r("enterEdit"), ["prevent"])
+		}, [l(S(B), {
 			name: "pencil",
 			size: "xs"
-		}), n[2] ||= s("span", null, "Edit", -1)], 32)], 512), [[C, !e.editing]]), T(s("div", st, [s("div", ct, [c(x(oe), {
+		}), n[2] ||= s("span", null, "Edit", -1)], 32)], 512), [[E, !e.editing]]), k(s("div", Tt, [s("div", Et, [l(S(V), {
 			class: "coar-md-code-lang-select",
 			"model-value": e.language,
 			options: i,
@@ -105,9 +138,9 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 			ref_key: "contentMount",
 			ref: a,
 			class: "coar-md-code-content"
-		}, null, 512)], 512), [[C, e.editing]])], 2));
+		}, null, 512)], 512), [[E, e.editing]])], 2));
 	}
-}), W = /* @__PURE__ */ new Set(), ut = class {
+}), Ot = /* @__PURE__ */ new Set(), kt = class {
 	dom;
 	contentDOM;
 	app;
@@ -115,11 +148,11 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 	language = v("");
 	editing = v(!1);
 	constructor(e, t, n) {
-		this.node = e, this.view = t, this.getPos = n, W.add(this), this.dom = document.createElement("div"), this.dom.className = "coar-md-code-host-mount";
+		this.node = e, this.view = t, this.getPos = n, Ot.add(this), this.dom = document.createElement("div"), this.dom.className = "coar-md-code-host-mount";
 		let i = document.createElement("pre"), a = document.createElement("code");
 		i.appendChild(a), this.contentDOM = a, this.text.value = e.textContent, this.language.value = e.attrs.language ?? "", this.app = r({
 			name: "CodeBlockShellRoot",
-			setup: () => () => u(lt, {
+			setup: () => () => d(Dt, {
 				text: this.text.value,
 				language: this.language.value,
 				editing: this.editing.value,
@@ -141,7 +174,7 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 		this.editing.value = !1;
 	}
 	destroy() {
-		W.delete(this), this.app.unmount();
+		Ot.delete(this), this.app.unmount();
 	}
 	notifySelectionChanged() {
 		let e = this.getPos();
@@ -159,20 +192,20 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 		let e = this.getPos();
 		if (e == null) return;
 		let { tr: t } = this.view.state;
-		t.setSelection(Se.create(this.view.state.doc, e + 1)), this.view.dispatch(t), this.view.focus();
+		t.setSelection(ke.create(this.view.state.doc, e + 1)), this.view.dispatch(t), this.view.focus();
 	};
 	handleLanguageChange = (e) => {
 		let t = this.getPos();
 		t != null && this.view.dispatch(this.view.state.tr.setNodeAttribute(t, "language", e));
 	};
-}, dt = [De(R.node, () => (e, t, n) => new ut(e, t, n)), Te(() => new xe({ view: () => ({ update(e, t) {
-	e.state.selection.eq(t.selection) || W.forEach((t) => {
+}, At = [Pe(me.node, () => (e, t, n) => new kt(e, t, n)), Me(() => new De({ view: () => ({ update(e, t) {
+	e.state.selection.eq(t.selection) || Ot.forEach((t) => {
 		t.view === e && t.notifySelectionChanged();
 	});
-} }) }))].flat(), ft = function() {
+} }) }))].flat(), jt = function() {
 	let e = this.data();
 	return (e.toMarkdownExtensions ??= []).push({ handlers: { colorTextSpan(e, t, n) {
-		let r = U(e.color ?? "") ?? "";
+		let r = Y(e.color ?? "") ?? "";
 		if (r.length === 0) return n.containerPhrasing(e, {
 			before: "",
 			after: ""
@@ -181,45 +214,45 @@ var ot = { class: "coar-md-code-render" }, st = { class: "coar-md-code-edit" },
 			before: ">",
 			after: "<"
 		});
-		return `${Ne(r)}${i}${Me()}`;
+		return `${Ve(r)}${i}${Be()}`;
 	} } }), (e) => {
 		t(e);
 	};
 	function t(e) {
 		if (Array.isArray(e.children)) {
-			let n = ht(e.children);
+			let n = Pt(e.children);
 			e.children = n;
 			for (let e of n) t(e);
 		}
 	}
 };
-function pt(e) {
+function Mt(e) {
 	return !!e && e.type === "html" && typeof e.value == "string";
 }
-function mt(e, t) {
+function Nt(e, t) {
 	let n = 1;
 	for (let r = t + 1; r < e.length; r++) {
 		let t = e[r];
-		if (pt(t)) {
-			if (Ae(t.value)) {
+		if (Mt(t)) {
+			if (Re(t.value)) {
 				n++;
 				continue;
 			}
-			if (Oe(t.value) && (n--, n === 0)) return r;
+			if (Ie(t.value) && (n--, n === 0)) return r;
 		}
 	}
 	return null;
 }
-function ht(e) {
+function Pt(e) {
 	let t = [], n = 0;
 	for (; n < e.length;) {
 		let r = e[n];
-		if (pt(r)) {
-			let i = Ae(r.value);
+		if (Mt(r)) {
+			let i = Re(r.value);
 			if (i) {
-				let r = mt(e, n);
+				let r = Nt(e, n);
 				if (r !== null) {
-					let a = ht(e.slice(n + 1, r)), o = {
+					let a = Pt(e.slice(n + 1, r)), o = {
 						type: "colorTextSpan",
 						color: i.color,
 						children: a,
@@ -234,7 +267,7 @@ function ht(e) {
 	}
 	return t;
 }
-var gt = [Ee("textColor", () => ft), Ce("text_color", () => ({
+var Ft = [Ne("textColor", () => jt), Ae("text_color", () => ({
 	attrs: { color: { default: "" } },
 	inclusive: !0,
 	parseDOM: [{
@@ -247,12 +280,12 @@ var gt = [Ee("textColor", () => ft), Ce("text_color", () => ({
 			if (n.length !== 1) return !1;
 			let r = n[0], i = r.indexOf(":");
 			if (i < 0 || r.slice(0, i).trim().toLowerCase() !== "color") return !1;
-			let a = U(r.slice(i + 1));
+			let a = Y(r.slice(i + 1));
 			return a === null ? !1 : { color: a };
 		}
 	}],
 	toDOM: (e) => {
-		let t = U(String(e.attrs.color ?? "")) ?? "";
+		let t = Y(String(e.attrs.color ?? "")) ?? "";
 		return t.length === 0 ? [
 			"span",
 			{},
@@ -266,7 +299,7 @@ var gt = [Ee("textColor", () => ft), Ce("text_color", () => ({
 	parseMarkdown: {
 		match: (e) => e.type === "colorTextSpan",
 		runner: (e, t, n) => {
-			let r = U(typeof t.color == "string" ? t.color : typeof t.data?.color == "string" ? t.data.color : "") ?? "";
+			let r = Y(typeof t.color == "string" ? t.color : typeof t.data?.color == "string" ? t.data.color : "") ?? "";
 			if (r.length === 0) {
 				e.next(t.children);
 				return;
@@ -277,11 +310,11 @@ var gt = [Ee("textColor", () => ft), Ce("text_color", () => ({
 	toMarkdown: {
 		match: (e) => e.type.name === "text_color",
 		runner: (e, t) => {
-			let n = U(String(t.attrs.color ?? "")) ?? "";
+			let n = Y(String(t.attrs.color ?? "")) ?? "";
 			n.length !== 0 && e.withMark(t, "colorTextSpan", void 0, { color: n });
 		}
 	}
-}))].flat(), _t = [
+}))].flat(), It = [
 	{
 		name: "Default",
 		value: ""
@@ -318,26 +351,26 @@ var gt = [Ee("textColor", () => ft), Ce("text_color", () => ({
 		name: "Gray",
 		value: "#6b7280"
 	}
-], vt = {
+], Lt = {
 	class: "coar-md-placeholder",
 	"aria-hidden": "true"
-}, yt = /* @__PURE__ */ l({
+}, Rt = /* @__PURE__ */ u({
 	__name: "PlaceholderOverlay",
 	props: { source: {} },
 	setup(e) {
-		let t = e, r = n(() => ke(t.source));
-		return (e, t) => (_(), o("div", vt, [c(x(Pe), { doc: r.value }, null, 8, ["doc"])]));
+		let t = e, r = n(() => Le(t.source));
+		return (e, t) => (_(), o("div", Lt, [l(S(He), { doc: r.value }, null, 8, ["doc"])]));
 	}
 });
-function G(e) {
+function zt(e) {
 	return e !== null && e < -2;
 }
-function K(e) {
+function Bt(e) {
 	return e === -2 || e === -1 || e === 32;
 }
 //#endregion
 //#region ../../node_modules/.pnpm/fault@2.0.1/node_modules/fault/index.js
-var bt = /* @__PURE__ */ rt((/* @__PURE__ */ tt(((e, t) => {
+var Vt = /* @__PURE__ */ vt((/* @__PURE__ */ gt(((e, t) => {
 	(function() {
 		var e = t === void 0 ? function() {
 			return this || (0, eval)("this");
@@ -391,55 +424,55 @@ var bt = /* @__PURE__ */ rt((/* @__PURE__ */ tt(((e, t) => {
 			return a;
 		}
 	})();
-})))(), 1), q = Object.assign(J(Error), {
-	eval: J(EvalError),
-	range: J(RangeError),
-	reference: J(ReferenceError),
-	syntax: J(SyntaxError),
-	type: J(TypeError),
-	uri: J(URIError)
+})))(), 1), Ht = Object.assign(X(Error), {
+	eval: X(EvalError),
+	range: X(RangeError),
+	reference: X(ReferenceError),
+	syntax: X(SyntaxError),
+	type: X(TypeError),
+	uri: X(URIError)
 });
-function J(e) {
+function X(e) {
 	return t.displayName = e.displayName || e.name, t;
 	function t(t, ...n) {
-		return new e(t && (0, bt.default)(t, ...n));
+		return new e(t && (0, Vt.default)(t, ...n));
 	}
 }
 //#endregion
 //#region ../../node_modules/.pnpm/micromark-extension-frontmatter@2.0.0/node_modules/micromark-extension-frontmatter/lib/to-matters.js
-var Y = {}.hasOwnProperty, xt = {
+var Ut = {}.hasOwnProperty, Wt = {
 	yaml: "-",
 	toml: "+"
 };
-function X(e) {
+function Gt(e) {
 	let t = [], n = -1, r = Array.isArray(e) ? e : e ? [e] : ["yaml"];
-	for (; ++n < r.length;) t[n] = St(r[n]);
+	for (; ++n < r.length;) t[n] = Kt(r[n]);
 	return t;
 }
-function St(e) {
+function Kt(e) {
 	let t = e;
 	if (typeof t == "string") {
-		if (!Y.call(xt, t)) throw q("Missing matter definition for `%s`", t);
+		if (!Ut.call(Wt, t)) throw Ht("Missing matter definition for `%s`", t);
 		t = {
 			type: t,
-			marker: xt[t]
+			marker: Wt[t]
 		};
-	} else if (typeof t != "object") throw q("Expected matter to be an object, not `%j`", t);
-	if (!Y.call(t, "type")) throw q("Missing `type` in matter `%j`", t);
-	if (!Y.call(t, "fence") && !Y.call(t, "marker")) throw q("Missing `marker` or `fence` in matter `%j`", t);
+	} else if (typeof t != "object") throw Ht("Expected matter to be an object, not `%j`", t);
+	if (!Ut.call(t, "type")) throw Ht("Missing `type` in matter `%j`", t);
+	if (!Ut.call(t, "fence") && !Ut.call(t, "marker")) throw Ht("Missing `marker` or `fence` in matter `%j`", t);
 	return t;
 }
 //#endregion
 //#region ../../node_modules/.pnpm/micromark-extension-frontmatter@2.0.0/node_modules/micromark-extension-frontmatter/lib/syntax.js
-function Ct(e) {
-	let t = X(e), n = {}, r = -1;
+function qt(e) {
+	let t = Gt(e), n = {}, r = -1;
 	for (; ++r < t.length;) {
-		let e = t[r], i = Z(e, "open").charCodeAt(0), a = wt(e), o = n[i];
+		let e = t[r], i = Yt(e, "open").charCodeAt(0), a = Jt(e), o = n[i];
 		Array.isArray(o) ? o.push(a) : n[i] = [a];
 	}
 	return { flow: n };
 }
-function wt(e) {
+function Jt(e) {
 	let t = e.anywhere, n = e.type, r = n + "Fence", i = r + "Sequence", a = n + "Value", o = {
 		tokenize: u,
 		partial: !0
@@ -453,27 +486,27 @@ function wt(e) {
 		return p;
 		function p(a) {
 			let o = f.now();
-			return o.column === 1 && (o.line === 1 || t) && (s = Z(e, "open"), c = 0, a === s.charCodeAt(c)) ? (l.enter(n), l.enter(r), l.enter(i), m(a)) : d(a);
+			return o.column === 1 && (o.line === 1 || t) && (s = Yt(e, "open"), c = 0, a === s.charCodeAt(c)) ? (l.enter(n), l.enter(r), l.enter(i), m(a)) : d(a);
 		}
 		function m(e) {
-			return c === s.length ? (l.exit(i), K(e) ? (l.enter("whitespace"), h(e)) : g(e)) : e === s.charCodeAt(c++) ? (l.consume(e), m) : d(e);
+			return c === s.length ? (l.exit(i), Bt(e) ? (l.enter("whitespace"), h(e)) : ee(e)) : e === s.charCodeAt(c++) ? (l.consume(e), m) : d(e);
 		}
 		function h(e) {
-			return K(e) ? (l.consume(e), h) : (l.exit("whitespace"), g(e));
+			return Bt(e) ? (l.consume(e), h) : (l.exit("whitespace"), ee(e));
 		}
-		function g(t) {
-			return G(t) ? (l.exit(r), l.enter("lineEnding"), l.consume(t), l.exit("lineEnding"), s = Z(e, "close"), c = 0, l.attempt(o, b, _)) : d(t);
+		function ee(t) {
+			return zt(t) ? (l.exit(r), l.enter("lineEnding"), l.consume(t), l.exit("lineEnding"), s = Yt(e, "close"), c = 0, l.attempt(o, y, g)) : d(t);
+		}
+		function g(e) {
+			return e === null || zt(e) ? v(e) : (l.enter(a), _(e));
 		}
 		function _(e) {
-			return e === null || G(e) ? y(e) : (l.enter(a), v(e));
+			return e === null || zt(e) ? (l.exit(a), v(e)) : (l.consume(e), _);
 		}
 		function v(e) {
-			return e === null || G(e) ? (l.exit(a), y(e)) : (l.consume(e), v);
+			return e === null ? d(e) : (l.enter("lineEnding"), l.consume(e), l.exit("lineEnding"), l.attempt(o, y, g));
 		}
 		function y(e) {
-			return e === null ? d(e) : (l.enter("lineEnding"), l.consume(e), l.exit("lineEnding"), l.attempt(o, b, _));
-		}
-		function b(e) {
 			return l.exit(n), u(e);
 		}
 	}
@@ -484,42 +517,42 @@ function wt(e) {
 			return t === s.charCodeAt(a) ? (e.enter(r), e.enter(i), c(t)) : n(t);
 		}
 		function c(t) {
-			return a === s.length ? (e.exit(i), K(t) ? (e.enter("whitespace"), l(t)) : u(t)) : t === s.charCodeAt(a++) ? (e.consume(t), c) : n(t);
+			return a === s.length ? (e.exit(i), Bt(t) ? (e.enter("whitespace"), l(t)) : u(t)) : t === s.charCodeAt(a++) ? (e.consume(t), c) : n(t);
 		}
 		function l(t) {
-			return K(t) ? (e.consume(t), l) : (e.exit("whitespace"), u(t));
+			return Bt(t) ? (e.consume(t), l) : (e.exit("whitespace"), u(t));
 		}
 		function u(i) {
-			return i === null || G(i) ? (e.exit(r), t(i)) : n(i);
+			return i === null || zt(i) ? (e.exit(r), t(i)) : n(i);
 		}
 	}
 }
-function Z(e, t) {
-	return e.marker ? Tt(e.marker, t).repeat(3) : Tt(e.fence, t);
+function Yt(e, t) {
+	return e.marker ? Xt(e.marker, t).repeat(3) : Xt(e.fence, t);
 }
-function Tt(e, t) {
+function Xt(e, t) {
 	return typeof e == "string" ? e : e[t];
 }
 //#endregion
 //#region ../../node_modules/.pnpm/escape-string-regexp@5.0.0/node_modules/escape-string-regexp/index.js
-function Et(e) {
+function Zt(e) {
 	if (typeof e != "string") throw TypeError("Expected a string");
 	return e.replace(/[|\\{}()[\]^$+*?.]/g, "\\$&").replace(/-/g, "\\x2d");
 }
 //#endregion
 //#region ../../node_modules/.pnpm/mdast-util-frontmatter@2.0.1/node_modules/mdast-util-frontmatter/lib/index.js
-function Dt(e) {
-	let t = X(e), n = {}, r = {}, i = -1;
+function Qt(e) {
+	let t = Gt(e), n = {}, r = {}, i = -1;
 	for (; ++i < t.length;) {
 		let e = t[i];
-		n[e.type] = Ot(e), r[e.type] = kt, r[e.type + "Value"] = At;
+		n[e.type] = $t(e), r[e.type] = en, r[e.type + "Value"] = tn;
 	}
 	return {
 		enter: n,
 		exit: r
 	};
 }
-function Ot(e) {
+function $t(e) {
 	return t;
 	function t(t) {
 		this.enter({
@@ -528,23 +561,23 @@ function Ot(e) {
 		}, t), this.buffer();
 	}
 }
-function kt(e) {
+function en(e) {
 	let t = this.resume(), n = this.stack[this.stack.length - 1];
 	"value" in n, this.exit(e), n.value = t.replace(/^(\r?\n|\r)|(\r?\n|\r)$/g, "");
 }
-function At(e) {
+function tn(e) {
 	this.config.enter.data.call(this, e), this.config.exit.data.call(this, e);
 }
-function jt(e) {
-	let t = [], n = {}, r = X(e), i = -1;
+function nn(e) {
+	let t = [], n = {}, r = Gt(e), i = -1;
 	for (; ++i < r.length;) {
 		let e = r[i];
-		n[e.type] = Mt(e);
-		let a = Q(e, "open");
+		n[e.type] = rn(e);
+		let a = an(e, "open");
 		t.push({
 			atBreak: !0,
 			character: a.charAt(0),
-			after: Et(a.charAt(1))
+			after: Zt(a.charAt(1))
 		});
 	}
 	return {
@@ -552,29 +585,29 @@ function jt(e) {
 		handlers: n
 	};
 }
-function Mt(e) {
-	let t = Q(e, "open"), n = Q(e, "close");
+function rn(e) {
+	let t = an(e, "open"), n = an(e, "close");
 	return r;
 	function r(e) {
 		return t + (e.value ? "\n" + e.value : "") + "\n" + n;
 	}
 }
-function Q(e, t) {
-	return e.marker ? Nt(e.marker, t).repeat(3) : Nt(e.fence, t);
+function an(e, t) {
+	return e.marker ? on(e.marker, t).repeat(3) : on(e.fence, t);
 }
-function Nt(e, t) {
+function on(e, t) {
 	return typeof e == "string" ? e : e[t];
 }
 //#endregion
 //#region ../../node_modules/.pnpm/remark-frontmatter@5.0.0/node_modules/remark-frontmatter/lib/index.js
-var Pt = "yaml";
-function Ft(e) {
-	let t = this, n = e || Pt, r = t.data(), i = r.micromarkExtensions ||= [], a = r.fromMarkdownExtensions ||= [], o = r.toMarkdownExtensions ||= [];
-	i.push(Ct(n)), a.push(Dt(n)), o.push(jt(n));
+var sn = "yaml";
+function cn(e) {
+	let t = this, n = e || sn, r = t.data(), i = r.micromarkExtensions ||= [], a = r.fromMarkdownExtensions ||= [], o = r.toMarkdownExtensions ||= [];
+	i.push(qt(n)), a.push(Qt(n)), o.push(nn(n));
 }
 //#endregion
 //#region src/frontmatter/index.ts
-var It = Ee("coarRemarkFrontmatter", () => Ft, ["yaml"]), Lt = we("frontmatter", () => ({
+var ln = Ne("coarRemarkFrontmatter", () => cn, ["yaml"]), un = je("frontmatter", () => ({
 	group: "block",
 	atom: !0,
 	marks: "",
@@ -602,8 +635,8 @@ var It = Ee("coarRemarkFrontmatter", () => Ft, ["yaml"]), Lt = we("frontmatter",
 		}
 	}
 }));
-function Rt(e, t) {
-	let { entries: n } = je(t);
+function dn(e, t) {
+	let { entries: n } = ze(t);
 	if (e.replaceChildren(), n.length === 0) {
 		let n = document.createElement("pre");
 		n.className = "coar-markdown-frontmatter__raw", n.textContent = t, e.appendChild(n);
@@ -618,14 +651,14 @@ function Rt(e, t) {
 		i.className = "coar-markdown-frontmatter__value", i.textContent = t.value, n.append(r, document.createTextNode(": "), i), e.appendChild(n);
 	}
 }
-var zt = class {
+var fn = class {
 	dom;
 	node;
 	constructor(e) {
 		this.node = e, this.dom = document.createElement("div"), this.dom.className = "coar-markdown-frontmatter", this.dom.setAttribute("data-type", "frontmatter"), this.dom.setAttribute("aria-label", "Document metadata"), this.dom.contentEditable = "false", this.dom.draggable = !1, this.renderCard();
 	}
 	renderCard() {
-		Rt(this.dom, this.node.attrs.value ?? "");
+		dn(this.dom, this.node.attrs.value ?? "");
 	}
 	update(e) {
 		if (e.type !== this.node.type) return !1;
@@ -638,15 +671,15 @@ var zt = class {
 	stopEvent() {
 		return !1;
 	}
-}, Bt = [
-	It,
-	Lt,
-	De(Lt.node, () => (e) => new zt(e))
-].flat(), Vt = { class: "coar-md-color-grid" }, Ht = [
+}, pn = [
+	ln,
+	un,
+	Pe(un.node, () => (e) => new fn(e))
+].flat(), mn = { class: "coar-md-color-grid" }, hn = [
 	"title",
 	"aria-label",
 	"onMousedown"
-], Ut = { class: "coar-md-color-custom" }, Wt = /* @__PURE__ */ l({
+], gn = { class: "coar-md-color-custom" }, _n = /* @__PURE__ */ u({
 	__name: "ColorPickerPanel",
 	props: {
 		currentColor: {},
@@ -657,35 +690,575 @@ var zt = class {
 		return (r, c) => (_(), o("div", {
 			class: "coar-md-color-picker",
 			role: "menu",
-			onMousedown: c[2] ||= E(() => {}, ["stop"])
-		}, [s("div", Vt, [(_(!0), o(e, null, y(x(_t), (e) => (_(), o("button", {
+			onMousedown: c[2] ||= j(() => {}, ["stop"])
+		}, [s("div", mn, [(_(!0), o(e, null, y(S(It), (e) => (_(), o("button", {
 			key: e.value || "default",
 			type: "button",
-			class: p([
+			class: m([
 				"coar-md-color-swatch",
 				e.value === "" ? "coar-md-color-swatch--clear" : "",
 				e.value !== "" && t.currentColor === e.value ? "coar-md-color-swatch--active" : ""
 			]),
-			style: m(e.value ? { "--coar-md-swatch": e.value } : void 0),
+			style: h(e.value ? { "--coar-md-swatch": e.value } : void 0),
 			title: e.name,
 			"aria-label": e.name,
-			onMousedown: E((n) => t.pick(e.value === "" ? null : e.value), ["prevent"])
-		}, [e.value === "" ? (_(), i(x(P), {
+			onMousedown: j((n) => t.pick(e.value === "" ? null : e.value), ["prevent"])
+		}, [e.value === "" ? (_(), i(S(B), {
 			key: 0,
 			name: "ban",
 			size: "s"
-		})) : a("", !0)], 46, Ht))), 128))]), s("div", Ut, [c[3] ||= s("label", {
+		})) : a("", !0)], 46, hn))), 128))]), s("div", gn, [c[3] ||= s("label", {
 			class: "coar-md-color-custom-label",
 			for: "coar-md-color-custom-input"
-		}, " Custom ", -1), T(s("input", {
+		}, " Custom ", -1), k(s("input", {
 			id: "coar-md-color-custom-input",
 			"onUpdate:modelValue": c[0] ||= (e) => n.value = e,
 			type: "color",
 			class: "coar-md-color-custom-input",
 			onChange: c[1] ||= (e) => t.pick(n.value)
-		}, null, 544), [[S, n.value]])])], 32));
+		}, null, 544), [[T, n.value]])])], 32));
+	}
+}), vn = [
+	"aria-label",
+	"onMouseover",
+	"onFocus",
+	"onClick"
+], yn = { class: "coar-md-table-picker__label" }, bn = /* @__PURE__ */ u({
+	__name: "TableSizePicker",
+	props: {
+		pick: { type: Function },
+		max: {}
+	},
+	setup(t) {
+		let r = t.max ?? 8, i = Array.from({ length: r }, (e, t) => t + 1), a = v(0), l = v(0), u = n(() => a.value > 0 ? `${l.value} × ${a.value}` : "Pick size");
+		function d(e, t) {
+			a.value = e, l.value = t;
+		}
+		function f() {
+			a.value = 0, l.value = 0;
+		}
+		function p(e, t) {
+			return e <= a.value && t <= l.value;
+		}
+		return (n, a) => (_(), o("div", {
+			class: "coar-md-table-picker",
+			onMouseleave: f
+		}, [
+			s("div", {
+				class: "coar-md-table-picker__grid",
+				style: h({ gridTemplateColumns: `repeat(${S(r)}, 1fr)` })
+			}, [(_(!0), o(e, null, y(S(i), (n) => (_(), o(e, { key: n }, [(_(!0), o(e, null, y(S(i), (e) => (_(), o("button", {
+				key: `${n}-${e}`,
+				type: "button",
+				class: m(["coar-md-table-picker__cell", { "coar-md-table-picker__cell--on": p(n, e) }]),
+				"aria-label": `${e} by ${n}`,
+				onMouseover: (t) => d(n, e),
+				onFocus: (t) => d(n, e),
+				onClick: (r) => t.pick(n, e)
+			}, null, 42, vn))), 128))], 64))), 128))], 4),
+			s("div", yn, x(u.value), 1),
+			a[0] ||= s("div", { class: "coar-md-table-picker__hint" }, [
+				c(" or type "),
+				s("code", null, "|3x4|"),
+				c(" + space ")
+			], -1)
+		], 32));
 	}
-}), Gt = [
+}), xn = (e, t) => {
+	let n = e.__vccOpts || e;
+	for (let [e, r] of t) n[e] = r;
+	return n;
+}, Sn = /* @__PURE__ */ xn(bn, [["__scopeId", "data-v-68fa1760"]]), Cn = {
+	key: 0,
+	class: "coar-md-th"
+}, wn = [
+	"aria-label",
+	"onMouseenter",
+	"onMousedown"
+], Tn = [
+	"aria-label",
+	"onMouseenter",
+	"onMousedown"
+], Z = 14, En = 4, Dn = /* @__PURE__ */ xn(/* @__PURE__ */ u({
+	__name: "TableHandles",
+	props: { area: {} },
+	emits: ["menuToggle"],
+	setup(r, { emit: s }) {
+		let c = r, u = s, [, d] = ae(), f = b(null), p = v(null), x = v(null), C = v(null), w = de();
+		D(w.isOpen, (e) => {
+			!e && x.value && (x.value = null, p.value = null, u("menuToggle", !1));
+		});
+		function T(e) {
+			return {
+				left: e.left,
+				top: e.top,
+				width: e.width,
+				height: e.height
+			};
+		}
+		function E(e) {
+			let t = Array.from(e.querySelectorAll("tr")), n = t[0];
+			if (!n) return null;
+			let r = Array.from(n.children);
+			return r.length === 0 ? null : {
+				table: e,
+				rect: T(e.getBoundingClientRect()),
+				cols: r.map((e) => T(e.getBoundingClientRect())),
+				rows: t.map((e) => T(e.getBoundingClientRect()))
+			};
+		}
+		function k(e, t, n) {
+			return t >= e.rect.left - Z - 4 && t <= e.rect.left + e.rect.width + Z + 4 && n >= e.rect.top - Z - 4 && n <= e.rect.top + e.rect.height + Z + 4;
+		}
+		let A = !1;
+		function j(e, t) {
+			let n = c.area?.querySelectorAll("table");
+			if (!n) return null;
+			for (let r of Array.from(n)) {
+				let n = r.getBoundingClientRect();
+				if (e >= n.left - Z - 4 && e <= n.right + Z + 4 && t >= n.top - Z - 4 && t <= n.bottom + Z + 4) return r;
+			}
+			return null;
+		}
+		function te(e) {
+			x.value || R || C.value || A || (A = !0, requestAnimationFrame(() => {
+				A = !1;
+				let t = e.clientX, n = e.clientY;
+				if (f.value && k(f.value, t, n)) return;
+				let r = j(t, n);
+				r ? f.value = E(r) : (f.value = null, p.value = null);
+			}));
+		}
+		function N() {
+			if (f.value) {
+				let e = E(f.value.table);
+				f.value = e, e || (p.value = null, w.close());
+			}
+		}
+		g(() => {
+			document.addEventListener("mousemove", te, !0), window.addEventListener("scroll", N, !0), window.addEventListener("resize", N);
+		}), ee(() => {
+			document.removeEventListener("mousemove", te, !0), document.removeEventListener("mousemove", le, !0), document.removeEventListener("mouseup", H, !0), window.removeEventListener("scroll", N, !0), window.removeEventListener("resize", N);
+		});
+		function F(e, t) {
+			let n = f.value, r = d();
+			if (!n || !r) return null;
+			let i = null;
+			return r.action((r) => {
+				let a = r.get(P), o = e === "col" ? n.table.querySelector("tr")?.children[t] : n.table.querySelectorAll("tr")[t]?.children[0];
+				o && (i = a.posAtDOM(o, 0));
+			}), i;
+		}
+		function I(e, t, ...n) {
+			let r = d(), i = F(e, t);
+			if (!r || i == null) return;
+			let a = e === "col" ? Qe : $e;
+			r.action((e) => {
+				let r = e.get(M);
+				r.call(a.key, {
+					index: t,
+					pos: i
+				});
+				for (let e of n) r.call(e.key);
+			}), w.close(), f.value = null;
+		}
+		function ne() {
+			x.value && I(x.value.kind, x.value.index, qe);
+		}
+		function re() {
+			if (!x.value) return;
+			let { kind: e, index: t } = x.value;
+			I(e, t, e === "col" ? We : Ke);
+		}
+		function ie() {
+			if (!x.value) return;
+			let { kind: e, index: t } = x.value;
+			I(e, t, e === "col" ? Ue : Ge);
+		}
+		function L(e, t) {
+			return p.value?.kind === e && p.value.index === t || x.value?.kind === e && x.value.index === t || C.value?.kind === e && C.value.from === t;
+		}
+		let R = null;
+		function z(e, t, n) {
+			let r = d(), i = F(e, t);
+			if (!r || i == null || t === n) return;
+			let a = e === "col" ? Qe : $e, o = e === "col" ? Xe : Ze;
+			r.action((e) => {
+				let r = e.get(M);
+				r.call(a.key, {
+					index: t,
+					pos: i
+				}), r.call(o.key, {
+					from: t,
+					to: n,
+					pos: i
+				});
+				let s = e.get(P), { state: c } = s;
+				c.selection.empty || s.dispatch(c.tr.setSelection(ke.create(c.doc, c.selection.from)));
+			}), f.value = null, p.value = null;
+		}
+		function B(e, t, n) {
+			let r = f.value;
+			if (!r) return 0;
+			if (e === "col") {
+				let e = r.cols.findIndex((e) => t < e.left + e.width);
+				return e === -1 ? r.cols.length - 1 : e;
+			}
+			let i = r.rows.findIndex((e) => n < e.top + e.height);
+			return i === -1 ? r.rows.length - 1 : i;
+		}
+		function V(e, t, n) {
+			n.preventDefault(), n.stopPropagation(), R = {
+				kind: e,
+				from: t,
+				x: n.clientX,
+				y: n.clientY,
+				ev: n
+			}, document.addEventListener("mousemove", le, !0), document.addEventListener("mouseup", H, !0);
+		}
+		function le(e) {
+			if (R) {
+				if (!C.value) {
+					if (Math.hypot(e.clientX - R.x, e.clientY - R.y) < En) return;
+					C.value = {
+						kind: R.kind,
+						from: R.from,
+						target: R.from
+					};
+				}
+				C.value = {
+					...C.value,
+					target: B(C.value.kind, e.clientX, e.clientY)
+				};
+			}
+		}
+		function H() {
+			if (document.removeEventListener("mousemove", le, !0), document.removeEventListener("mouseup", H, !0), C.value) {
+				let { kind: e, from: t, target: n } = C.value;
+				C.value = null, z(e, t, n);
+			} else R && ue(R.kind, R.from, R.ev);
+			R = null;
+		}
+		function ue(e, t, n) {
+			n.preventDefault(), n.stopPropagation(), x.value = {
+				kind: e,
+				index: t
+			}, u("menuToggle", !0), w.open(n), requestAnimationFrame(N);
+		}
+		let U = n(() => {
+			let e = f.value;
+			return e ? [{
+				key: "top",
+				left: e.rect.left,
+				top: e.rect.top - Z,
+				width: e.rect.width,
+				height: Z
+			}, {
+				key: "bottom",
+				left: e.rect.left,
+				top: e.rect.top + e.rect.height,
+				width: e.rect.width,
+				height: Z
+			}] : [];
+		}), W = n(() => {
+			let e = f.value;
+			return e ? [{
+				key: "left",
+				left: e.rect.left - Z,
+				top: e.rect.top,
+				width: Z,
+				height: e.rect.height
+			}, {
+				key: "right",
+				left: e.rect.left + e.rect.width,
+				top: e.rect.top,
+				width: Z,
+				height: e.rect.height
+			}] : [];
+		}), G = n(() => {
+			let e = f.value, t = p.value ?? x.value ?? (C.value ? {
+				kind: C.value.kind,
+				index: C.value.from
+			} : null);
+			if (!e || !t) return null;
+			if (t.kind === "col") {
+				let n = e.cols[t.index];
+				return n && {
+					left: `${n.left}px`,
+					top: `${e.rect.top}px`,
+					width: `${n.width}px`,
+					height: `${e.rect.height}px`
+				};
+			}
+			let n = e.rows[t.index];
+			return n && {
+				left: `${e.rect.left}px`,
+				top: `${n.top}px`,
+				width: `${e.rect.width}px`,
+				height: `${n.height}px`
+			};
+		}), K = n(() => {
+			let e = f.value, t = C.value;
+			if (!e || !t) return null;
+			if (t.kind === "col") {
+				let n = e.cols[t.target], r = t.target >= t.from ? n.left + n.width : n.left;
+				return n && {
+					left: `${r}px`,
+					top: `${e.rect.top}px`,
+					width: "2px",
+					height: `${e.rect.height}px`
+				};
+			}
+			let n = e.rows[t.target], r = t.target >= t.from ? n.top + n.height : n.top;
+			return n && {
+				left: `${e.rect.left}px`,
+				top: `${r}px`,
+				width: `${e.rect.width}px`,
+				height: "2px"
+			};
+		});
+		return (n, r) => (_(), i(t, { to: "body" }, [f.value ? (_(), o("div", Cn, [
+			G.value ? (_(), o("div", {
+				key: 0,
+				class: "coar-md-th__hl",
+				style: h(G.value)
+			}, null, 4)) : a("", !0),
+			K.value ? (_(), o("div", {
+				key: 1,
+				class: "coar-md-th__drop",
+				style: h(K.value)
+			}, null, 4)) : a("", !0),
+			(_(!0), o(e, null, y(U.value, (t) => (_(), o("div", {
+				key: t.key,
+				class: "coar-md-th__bar coar-md-th__bar--col",
+				style: h({
+					left: `${t.left}px`,
+					top: `${t.top}px`,
+					width: `${t.width}px`,
+					height: `${t.height}px`
+				})
+			}, [(_(!0), o(e, null, y(f.value.cols, (e, t) => (_(), o("button", {
+				key: `c${t}`,
+				type: "button",
+				class: m(["coar-md-th__grip", { "coar-md-th__grip--active": L("col", t) }]),
+				style: h({
+					left: `${e.left - f.value.rect.left}px`,
+					width: `${e.width}px`
+				}),
+				"aria-label": `Column ${t + 1} options`,
+				onMouseenter: (e) => p.value = {
+					kind: "col",
+					index: t
+				},
+				onMouseleave: r[0] ||= (e) => p.value = null,
+				onMousedown: (e) => V("col", t, e)
+			}, null, 46, wn))), 128))], 4))), 128)),
+			(_(!0), o(e, null, y(W.value, (t) => (_(), o("div", {
+				key: t.key,
+				class: "coar-md-th__bar coar-md-th__bar--row",
+				style: h({
+					left: `${t.left}px`,
+					top: `${t.top}px`,
+					width: `${t.width}px`,
+					height: `${t.height}px`
+				})
+			}, [(_(!0), o(e, null, y(f.value.rows, (e, t) => (_(), o("button", {
+				key: `r${t}`,
+				type: "button",
+				class: m(["coar-md-th__grip", { "coar-md-th__grip--active": L("row", t) }]),
+				style: h({
+					top: `${e.top - f.value.rect.top}px`,
+					height: `${e.height}px`
+				}),
+				"aria-label": `Row ${t + 1} options`,
+				onMouseenter: (e) => p.value = {
+					kind: "row",
+					index: t
+				},
+				onMouseleave: r[1] ||= (e) => p.value = null,
+				onMousedown: (e) => V("row", t, e)
+			}, null, 46, Tn))), 128))], 4))), 128))
+		])) : a("", !0), l(S(oe), { menu: S(w) }, {
+			default: O(() => [
+				l(S(ce), {
+					label: x.value?.kind === "col" ? "Insert column left" : "Insert row above",
+					icon: x.value?.kind === "col" ? "table-column-plus-left" : "table-row-plus-above",
+					onClicked: re
+				}, null, 8, ["label", "icon"]),
+				l(S(ce), {
+					label: x.value?.kind === "col" ? "Insert column right" : "Insert row below",
+					icon: x.value?.kind === "col" ? "table-column-plus-right" : "table-row-plus-below",
+					onClicked: ie
+				}, null, 8, ["label", "icon"]),
+				l(S(se)),
+				l(S(ce), {
+					label: x.value?.kind === "col" ? "Delete column" : "Delete row",
+					icon: "trash-2",
+					onClicked: ne
+				}, null, 8, ["label"])
+			]),
+			_: 1
+		}, 8, ["menu"])]));
+	}
+}), [["__scopeId", "data-v-24e26df4"]]), On = ["onKeydown"], kn = { ref: "urlField" }, An = { class: "coar-md-image-dialog__actions" }, jn = /* @__PURE__ */ xn(/* @__PURE__ */ u({
+	__name: "ImageInsertDialog",
+	props: {
+		close: { type: Function },
+		initialUrl: {},
+		initialAlt: {},
+		initialTitle: {}
+	},
+	setup(e) {
+		let t = e, r = v(t.initialUrl ?? ""), i = v(t.initialAlt ?? ""), a = v(t.initialTitle ?? ""), u = w("urlField"), d = n(() => r.value.trim().length > 0);
+		function f() {
+			d.value && t.close({
+				url: r.value.trim(),
+				alt: i.value.trim(),
+				title: a.value.trim()
+			});
+		}
+		function p() {
+			t.close();
+		}
+		return g(() => {
+			u.value?.querySelector("input")?.focus();
+		}), (e, t) => (_(), o("div", {
+			class: "coar-md-image-dialog",
+			onKeydown: A(j(f, ["prevent"]), ["enter"])
+		}, [
+			s("div", kn, [l(S(z), {
+				label: "Image URL",
+				required: ""
+			}, {
+				default: O(() => [l(S(W), {
+					modelValue: r.value,
+					"onUpdate:modelValue": t[0] ||= (e) => r.value = e,
+					placeholder: "https://example.com/image.png",
+					autocomplete: "off"
+				}, null, 8, ["modelValue"])]),
+				_: 1
+			})], 512),
+			l(S(z), { label: "Alt text" }, {
+				default: O(() => [l(S(W), {
+					modelValue: i.value,
+					"onUpdate:modelValue": t[1] ||= (e) => i.value = e,
+					placeholder: "Describe the image",
+					autocomplete: "off"
+				}, null, 8, ["modelValue"])]),
+				_: 1
+			}),
+			l(S(z), { label: "Title (optional)" }, {
+				default: O(() => [l(S(W), {
+					modelValue: a.value,
+					"onUpdate:modelValue": t[2] ||= (e) => a.value = e,
+					placeholder: "Shown on hover",
+					autocomplete: "off"
+				}, null, 8, ["modelValue"])]),
+				_: 1
+			}),
+			s("div", An, [l(S(L), {
+				variant: "tertiary",
+				type: "button",
+				onClick: p
+			}, {
+				default: O(() => [...t[3] ||= [c("Cancel", -1)]]),
+				_: 1
+			}), l(S(L), {
+				variant: "primary",
+				type: "button",
+				disabled: !d.value,
+				onClick: f
+			}, {
+				default: O(() => [...t[4] ||= [c("Insert", -1)]]),
+				_: 1
+			}, 8, ["disabled"])])
+		], 40, On));
+	}
+}), [["__scopeId", "data-v-a0456b93"]]), Q = new Oe("coar-image-upload-placeholder");
+function Mn() {
+	let e = document.createElement("span");
+	return e.className = "coar-md-image-uploading", e.setAttribute("aria-label", "Uploading image…"), e.setAttribute("role", "img"), e;
+}
+function Nn(e, t) {
+	let n = Q.getState(e.state);
+	if (!n) return null;
+	let r = n.find(void 0, void 0, (e) => e.id === t);
+	return r.length ? r[0].from : null;
+}
+function Pn(e) {
+	return e ? Array.from(e.files).filter((e) => e.type.startsWith("image/")) : [];
+}
+function Fn(e, t, n, r) {
+	let i = r.getUploader();
+	if (!i) return;
+	let a = { token: Symbol("coar-image-upload") };
+	e.dispatch(e.state.tr.setMeta(Q, {
+		type: "add",
+		id: a,
+		pos: n
+	})), i(t).then(({ url: n, alt: r }) => {
+		let i = Nn(e, a);
+		if (i === null) return;
+		let o = e.state.schema.nodes.image;
+		if (!o) return;
+		let s = o.create({
+			src: n,
+			alt: r ?? t.name.replace(/\.[^.]+$/, "")
+		}), c = e.state.tr.replaceWith(i, i, s).setMeta(Q, {
+			type: "remove",
+			id: a
+		});
+		e.dispatch(c);
+	}).catch((n) => {
+		Nn(e, a) !== null && e.dispatch(e.state.tr.setMeta(Q, {
+			type: "remove",
+			id: a
+		})), (r.onError ?? ((e) => console.error("[CoarMarkdownEditor] image upload failed", e)))(n, t);
+	});
+}
+function In(e) {
+	return Me(() => new De({
+		key: Q,
+		state: {
+			init: () => rt.empty,
+			apply(e, t) {
+				let n = t.map(e.mapping, e.doc), r = e.getMeta(Q);
+				if (r?.type === "add") {
+					let t = nt.widget(r.pos, Mn(), { id: r.id });
+					n = n.add(e.doc, [t]);
+				} else r?.type === "remove" && (n = n.remove(n.find(void 0, void 0, (e) => e.id === r.id)));
+				return n;
+			}
+		},
+		props: {
+			decorations(e) {
+				return Q.getState(e);
+			},
+			handlePaste(t, n) {
+				if (!e.getUploader()) return !1;
+				let r = Pn(n.clipboardData);
+				if (r.length === 0) return !1;
+				n.preventDefault();
+				let i = t.state.selection.from;
+				return r.forEach((n) => Fn(t, n, i, e)), !0;
+			},
+			handleDrop(t, n, r, i) {
+				if (i || !e.getUploader()) return !1;
+				let a = Pn(n.dataTransfer);
+				if (a.length === 0) return !1;
+				n.preventDefault();
+				let o = t.posAtCoords({
+					left: n.clientX,
+					top: n.clientY
+				})?.pos ?? t.state.selection.from;
+				return a.forEach((n) => Fn(t, n, o, e)), !0;
+			}
+		}
+	}));
+}
+//#endregion
+//#region src/CoarMarkdownEditor.vue?vue&type=script&lang.ts
+var Ln = [
 	"bold",
 	"italic",
 	"strikethrough",
@@ -702,55 +1275,56 @@ var zt = class {
 	"codeBlock",
 	"table",
 	"tableOps",
+	"image",
 	"clearFormatting",
 	"undo",
 	"redo"
 ], $ = {
-	bold: { command: ge },
-	italic: { command: me },
-	strike: { command: He },
-	code: { command: he },
-	bulletList: { command: ye },
-	orderedList: { command: be },
-	blockquote: { command: ve },
-	hr: { command: fe },
-	codeBlock: { command: de },
-	table: { command: Ve },
-	undo: { command: Ge },
-	redo: { command: We },
-	paragraph: { command: _e },
-	addRowBefore: { command: Re },
-	addRowAfter: { command: Le },
-	addColBefore: { command: Ie },
-	addColAfter: { command: Fe },
-	deleteCell: { command: ze },
-	indent: { command: pe },
-	outdent: { command: B },
+	bold: { command: Se },
+	italic: { command: be },
+	strike: { command: tt },
+	code: { command: xe },
+	bulletList: { command: Te },
+	orderedList: { command: Ee },
+	blockquote: { command: we },
+	hr: { command: ge },
+	codeBlock: { command: he },
+	table: { command: Ye },
+	undo: { command: ot },
+	redo: { command: at },
+	paragraph: { command: Ce },
+	addRowBefore: { command: Ke },
+	addRowAfter: { command: Ge },
+	addColBefore: { command: We },
+	addColAfter: { command: Ue },
+	deleteCell: { command: qe },
+	indent: { command: ye },
+	outdent: { command: ve },
 	h1: {
-		command: V,
+		command: J,
 		payload: 1
 	},
 	h2: {
-		command: V,
+		command: J,
 		payload: 2
 	},
 	h3: {
-		command: V,
+		command: J,
 		payload: 3
 	},
 	h4: {
-		command: V,
+		command: J,
 		payload: 4
 	},
 	h5: {
-		command: V,
+		command: J,
 		payload: 5
 	},
 	h6: {
-		command: V,
+		command: J,
 		payload: 6
 	}
-}, Kt = l({
+}, Rn = u({
 	props: {
 		initialValue: {
 			type: String,
@@ -780,6 +1354,10 @@ var zt = class {
 			type: Array,
 			default: void 0
 		},
+		flavor: {
+			type: [String, Object],
+			default: void 0
+		},
 		inputId: {
 			type: String,
 			required: !0
@@ -808,53 +1386,64 @@ var zt = class {
 			type: Boolean,
 			default: !1
 		},
+		uploadImage: {
+			type: Function,
+			default: void 0
+		},
+		pickImage: {
+			type: Function,
+			default: void 0
+		},
 		onMarkdownChange: {
 			type: Function,
 			required: !0
 		}
 	},
 	setup(e) {
-		let t = v(e.initialValue), n = v("rendered");
-		M((n) => ne.make().config((r) => {
-			r.set(A, n), r.set(re, e.initialValue), r.update(k, (t) => ({
-				...t,
-				editable: () => !e.readonly
-			})), r.get(Je).markdownUpdated((n, r) => {
-				r !== t.value && (t.value = r, e.onMarkdownChange(r));
-			});
-		}).use(z).use(Be).use(Bt).use(Ue).use(Ke).use(qe).use(gt).use(dt));
-		let [r, i] = ae(), a = v(null);
-		return w(() => e.externalValue.value, (e) => {
+		let t = v(e.initialValue), n = v("rendered"), r = Ct(e.flavor);
+		ie((n) => {
+			let i = te.make().config((r) => {
+				r.set(I, n), r.set(N, e.initialValue), r.update(F, (t) => ({
+					...t,
+					editable: () => !e.readonly
+				})), r.get(lt).markdownUpdated((n, r) => {
+					r !== t.value && (t.value = r, e.onMarkdownChange(r));
+				});
+			}).use(q);
+			return r.gfm && i.use(Je), i.use(pn).use(it).use(st).use(ct), r.textColor && i.use(Ft), i.use(At).use(In({ getUploader: () => e.uploadImage })), i;
+		});
+		let [i, a] = ae(), o = v(null);
+		return D(() => e.externalValue.value, (e) => {
 			if (e === t.value) return;
 			if (n.value === "source") {
 				t.value = e;
 				return;
 			}
-			let r = i();
+			let r = a();
 			if (!r) {
-				a.value = e;
+				o.value = e;
 				return;
 			}
-			a.value = null, t.value = e, r.action(H(e));
-		}), w(n, (e) => {
+			o.value = null, t.value = e, r.action(Fe(e));
+		}), D(n, (e) => {
 			if (e !== "rendered") return;
-			let n = i();
-			n && n.action(H(t.value));
-		}), w(r, (e) => {
-			if (e || a.value === null) return;
-			let n = i();
+			let n = a();
+			n && n.action(Fe(t.value));
+		}), D(i, (e) => {
+			if (e || o.value === null) return;
+			let n = a();
 			if (!n) return;
-			let r = a.value;
-			a.value = null, r !== t.value && (t.value = r, n.action(H(r)));
-		}, { immediate: !0 }), w(() => e.readonly, () => {
-			let t = i();
+			let r = o.value;
+			o.value = null, r !== t.value && (t.value = r, n.action(Fe(r)));
+		}, { immediate: !0 }), D(() => e.readonly, () => {
+			let t = a();
 			t && t.action((t) => {
-				t.update(k, (t) => ({
+				t.update(F, (t) => ({
 					...t,
 					editable: () => !e.readonly
-				})), t.get(O).update(t.get(O).props);
+				})), t.get(P).update(t.get(P).props);
 			});
-		}), () => u(qt, {
+		}), () => d(zn, {
 			readonly: e.readonly,
 			disabled: e.disabled,
 			toolbarMode: e.toolbarMode,
@@ -866,6 +1455,8 @@ var zt = class {
 			name: e.name,
 			required: e.required,
 			placeholder: e.placeholder,
+			pickImage: e.pickImage,
+			flavor: e.flavor,
 			isEmpty: t.value.trim() === "",
 			sourceToggle: e.sourceToggle,
 			viewMode: n.value,
@@ -878,7 +1469,7 @@ var zt = class {
 			}
 		});
 	}
-}), qt = l({
+}), zn = u({
 	props: {
 		readonly: {
 			type: Boolean,
@@ -900,6 +1491,10 @@ var zt = class {
 			type: Array,
 			default: void 0
 		},
+		flavor: {
+			type: [String, Object],
+			default: void 0
+		},
 		inputId: {
 			type: String,
 			required: !0
@@ -924,6 +1519,10 @@ var zt = class {
 			type: String,
 			default: ""
 		},
+		pickImage: {
+			type: Function,
+			default: void 0
+		},
 		isEmpty: {
 			type: Boolean,
 			default: !1
@@ -950,10 +1549,10 @@ var zt = class {
 		}
 	},
 	setup(e) {
-		let [, r] = ae(), i = v(null), a = v(!1), o = v({
+		let [, r] = ae(), i = v(null), a = v(null), o = v(!1), s = v(!1), c = v({
 			left: "0px",
 			top: "0px"
-		}), s = v("text"), c = v(!1), l = {
+		}), l = v("text"), u = v(!1), f = {
 			strong: !1,
 			emphasis: !1,
 			strike_through: !1,
@@ -965,40 +1564,72 @@ var zt = class {
 			blockquote: !1,
 			heading: null,
 			table: !1,
+			cell_alignment: null,
 			code_block: !1,
 			list_item_depth: 0
-		}, d = ue(), p = null, m = v({ ...l });
-		function _(t) {
+		}, m = pe(), h = fe(), _ = null, y = null, b = v({ ...f });
+		function x(t) {
+			if (e.readonly) return;
+			let n = r();
+			n && (n.action((e) => {
+				e.get(M).call(t.command.key, t.payload);
+			}), R());
+		}
+		function S(t) {
 			if (e.readonly) return;
 			let n = r();
 			n && (n.action((e) => {
-				e.get(D).call(t.command.key, t.payload);
-			}), T());
+				let n = e.get(P), { state: r } = n, { $from: i } = r.selection, a = -1, o = null, s = -1;
+				for (let e = i.depth; e > 0; e--) {
+					let t = i.node(e);
+					t.type.name === "table" && (o = t, a = i.before(e)), (t.type.name === "table_cell" || t.type.name === "table_header") && s < 0 && (s = e);
+				}
+				if (!o || s < 0) return;
+				let c = i.index(s - 1), l = r.tr;
+				o.forEach((e, n) => {
+					e.forEach((e, r, i) => {
+						if (i !== c) return;
+						let o = a + 1 + n + 1 + r;
+						l = l.setNodeMarkup(o, void 0, {
+							...e.attrs,
+							alignment: t
+						});
+					});
+				}), l.docChanged && n.dispatch(l);
+			}), R());
 		}
-		function y(t) {
+		function C() {
+			if (e.readonly) return;
+			let t = r();
+			t && (t.action((e) => {
+				let t = e.get(M);
+				t.call(et.key), t.call(qe.key);
+			}), R());
+		}
+		function w(t) {
 			if (e.readonly) return;
-			let n = t === "bullet_list" ? $.bulletList : $.orderedList, r = at({
+			let n = t === "bullet_list" ? $.bulletList : $.orderedList, r = xt({
 				target: t,
-				inBulletList: m.value.bullet_list,
-				inOrderedList: m.value.ordered_list
+				inBulletList: b.value.bullet_list,
+				inOrderedList: b.value.ordered_list
 			});
 			if (r === "lift") {
-				_({ command: B });
+				x({ command: ve });
 				return;
 			}
-			r === "switch" && _({ command: B }), _(n);
+			r === "switch" && x({ command: ve }), x(n);
 		}
-		let b = n(() => e.tools ? new Set(e.tools) : void 0);
-		function x(e) {
-			return it(e, b.value);
+		let T = n(() => e.tools ? new Set(e.tools) : void 0), E = n(() => Ct(e.flavor));
+		function D(e) {
+			return yt(e, E.value) ? bt(e, T.value) : !1;
 		}
-		function ee(t) {
+		function O(t) {
 			if (e.readonly) return;
 			let n = r();
 			if (!n) return;
-			let i = t === null ? null : U(t);
+			let i = t === null ? null : Y(t);
 			n.action((e) => {
-				let t = e.get(O), { state: n } = t, r = n.schema.marks.text_color;
+				let t = e.get(P), { state: n } = t, r = n.schema.marks.text_color;
 				if (!r) return;
 				let { from: a, to: o, empty: s } = n.selection;
 				if (s) {
@@ -1008,17 +1639,17 @@ var zt = class {
 					let e = n.tr.removeMark(a, o, r);
 					i && (e = e.addMark(a, o, r.create({ color: i }))), t.dispatch(e);
 				}
-			}), S(), T();
+			}), A(), R();
 		}
-		function te(e) {
+		function k(e) {
 			if (e) {
-				if (p && !p.isClosed) {
-					S();
+				if (_ && !_.isClosed) {
+					A();
 					return;
 				}
-				p = d.open({
+				_ = m.open({
 					spec: {
-						...le,
+						...K,
 						anchor: {
 							kind: "element",
 							element: e
@@ -1026,35 +1657,110 @@ var zt = class {
 					},
 					content: {
 						kind: "component",
-						component: f(Wt)
+						component: p(_n)
 					},
 					inputs: {
-						currentColor: m.value.text_color,
-						pick: (e) => ee(e)
+						currentColor: b.value.text_color,
+						pick: (e) => O(e)
 					}
-				}), p.afterClosed.then(() => {
-					p?.isClosed && (p = null);
+				}), _.afterClosed.then(() => {
+					_?.isClosed && (_ = null);
 				});
 			}
 		}
-		function S() {
-			p && !p.isClosed && p.close(), p = null;
+		function A() {
+			_ && !_.isClosed && _.close(), _ = null;
 		}
-		function C() {
+		function j(t, n) {
+			if (N(), e.readonly) return;
+			let i = r();
+			i && (i.action((e) => {
+				e.get(M).call(Ye.key, {
+					row: t,
+					col: n
+				});
+			}), R());
+		}
+		function te(t) {
+			if (!(!t || e.readonly)) {
+				if (y && !y.isClosed) {
+					N();
+					return;
+				}
+				y = m.open({
+					spec: {
+						...K,
+						anchor: {
+							kind: "element",
+							element: t
+						}
+					},
+					content: {
+						kind: "component",
+						component: p(Sn)
+					},
+					inputs: { pick: (e, t) => j(e, t) }
+				}), y.afterClosed.then(() => {
+					y?.isClosed && (y = null);
+				});
+			}
+		}
+		function N() {
+			y && !y.isClosed && y.close(), y = null;
+		}
+		function F(t) {
+			if (e.readonly || !t.url) return;
+			let n = r();
+			n && n.action((e) => {
+				e.get(M).call(_e.key, {
+					src: t.url,
+					alt: t.alt || void 0,
+					title: t.title || void 0
+				});
+			});
+		}
+		function I() {
+			let e = r();
+			if (!e) return "";
+			let t = "";
+			return e.action((e) => {
+				let { state: n } = e.get(P), { from: r, to: i } = n.selection;
+				t = n.doc.textBetween(r, i, " ");
+			}), t;
+		}
+		function re() {
+			if (e.readonly) return;
+			let t = e.pickImage;
+			if (t) {
+				t({
+					insertImage: F,
+					selectedText: I()
+				});
+				return;
+			}
+			h.open(jn, {
+				title: "Insert image",
+				size: "s"
+			}).result.then((e) => {
+				let t = e;
+				t?.url && F(t);
+			});
+		}
+		function ie() {
 			if (e.readonly) return;
 			let t = r();
 			t && t.action((e) => {
-				let t = e.get(O), { state: n } = t, r = n.tr, { from: i, to: a, empty: o } = n.selection;
+				let t = e.get(P), { state: n } = t, r = n.tr, { from: i, to: a, empty: o } = n.selection;
 				o ? r = r.setStoredMarks([]) : Object.values(n.schema.marks).forEach((e) => {
 					r = r.removeMark(i, a, e);
-				}), t.dispatch(r), e.get(D).call(_e.key);
+				}), t.dispatch(r), e.get(M).call(Ce.key);
 			});
 		}
-		function w() {
+		function L() {
 			if (e.readonly) return;
 			let t = r();
 			t && t.action((e) => {
-				let n = e.get(O), { $from: r } = n.state.selection;
+				let n = e.get(P), { $from: r } = n.state.selection;
 				for (let e = r.depth; e > 0; e--) {
 					let t = r.node(e);
 					if (t.type.name === "list_item") {
@@ -1063,9 +1769,9 @@ var zt = class {
 						return;
 					}
 				}
-				e.get(D).call(ye.key), queueMicrotask(() => {
+				e.get(M).call(Te.key), queueMicrotask(() => {
 					t.action((e) => {
-						let t = e.get(O), { $from: n } = t.state.selection;
+						let t = e.get(P), { $from: n } = t.state.selection;
 						for (let e = n.depth; e > 0; e--) if (n.node(e).type.name === "list_item") {
 							t.dispatch(t.state.tr.setNodeAttribute(n.before(e), "checked", !1));
 							return;
@@ -1074,11 +1780,11 @@ var zt = class {
 				});
 			});
 		}
-		function T() {
+		function R() {
 			let e = r();
 			if (e) try {
 				e.action((e) => {
-					let t = e.get(O).state, { from: n, to: r, empty: i, $from: a } = t.selection, o = t.storedMarks, s = { ...l }, c = (e) => {
+					let t = e.get(P).state, { from: n, to: r, empty: i, $from: a } = t.selection, o = t.storedMarks, s = { ...f }, c = (e) => {
 						let s = t.schema.marks[e];
 						if (!s) return !1;
 						if (i) {
@@ -1088,56 +1794,64 @@ var zt = class {
 						return t.doc.rangeHasMark(n, r, s);
 					};
 					s.strong = c("strong"), s.emphasis = c("emphasis"), s.strike_through = c("strike_through"), s.inlineCode = c("inlineCode");
-					let u = t.schema.marks.text_color;
-					u && (s.text_color = (() => {
+					let l = t.schema.marks.text_color;
+					l && (s.text_color = (() => {
 						if (i) {
-							let e = (o ?? a.marks()).find((e) => e.type === u), t = typeof e?.attrs.color == "string" ? e.attrs.color : null;
-							return t ? U(t) : null;
+							let e = (o ?? a.marks()).find((e) => e.type === l), t = typeof e?.attrs.color == "string" ? e.attrs.color : null;
+							return t ? Y(t) : null;
 						}
 						let e = null;
 						return t.doc.nodesBetween(n, r, (t) => {
 							if (e) return !1;
-							let n = t.marks.find((e) => e.type === u);
+							let n = t.marks.find((e) => e.type === l);
 							if (n) {
 								let t = typeof n.attrs.color == "string" ? n.attrs.color : null;
-								e = t ? U(t) : null;
+								e = t ? Y(t) : null;
 							}
 							return e === null;
 						}), e;
 					})());
 					for (let e = a.depth; e > 0; e--) {
 						let t = a.node(e), n = t.type.name;
-						n === "bullet_list" ? s.bullet_list = !0 : n === "ordered_list" ? s.ordered_list = !0 : n === "blockquote" ? s.blockquote = !0 : n === "heading" ? s.heading = t.attrs.level ?? null : n === "table" ? s.table = !0 : n === "code_block" ? s.code_block = !0 : n === "list_item" && (s.list_item_depth += 1, t.attrs.checked != null && (s.task_list = !0));
+						if (n === "bullet_list") s.bullet_list = !0;
+						else if (n === "ordered_list") s.ordered_list = !0;
+						else if (n === "blockquote") s.blockquote = !0;
+						else if (n === "heading") s.heading = t.attrs.level ?? null;
+						else if (n === "table") s.table = !0;
+						else if (n === "table_cell" || n === "table_header") {
+							let e = t.attrs.alignment;
+							(e === "left" || e === "center" || e === "right") && (s.cell_alignment = e);
+						} else n === "code_block" ? s.code_block = !0 : n === "list_item" && (s.list_item_depth += 1, t.attrs.checked != null && (s.task_list = !0));
 					}
-					m.value = s;
+					b.value = s;
 				});
 			} catch {
-				m.value = { ...l };
+				b.value = { ...f };
 			}
 		}
-		function E(t) {
+		function oe(t) {
 			if (e.readonly) return;
 			let n = t.target, i = n.closest("li[data-item-type=\"task\"]");
 			if (i) {
 				let e = i.getBoundingClientRect();
 				if (t.clientX - e.left < 18) {
-					t.preventDefault(), ne(i);
+					t.preventDefault(), z(i);
 					return;
 				}
 			}
 			if (n.closest(".ProseMirror")) return;
 			let a = r();
 			a && (t.preventDefault(), a.action((e) => {
-				let t = e.get(O);
+				let t = e.get(P);
 				t.focus();
-				let n = t.state.tr.setSelection(Se.atEnd(t.state.doc));
+				let n = t.state.tr.setSelection(ke.atEnd(t.state.doc));
 				t.dispatch(n);
 			}));
 		}
-		function ne(e) {
+		function z(e) {
 			let t = r();
 			t && t.action((t) => {
-				let n = t.get(O), r = n.posAtDOM(e, 0);
+				let n = t.get(P), r = n.posAtDOM(e, 0);
 				if (r < 0) return;
 				let i = n.state.doc.resolve(r);
 				for (let e = i.depth; e >= 0; e--) {
@@ -1150,13 +1864,13 @@ var zt = class {
 				}
 			});
 		}
-		function re() {
+		function se() {
 			let e = r();
 			if (!e) return "text";
 			try {
 				let t = "text";
 				return e.action((e) => {
-					let { $from: n } = e.get(O).state.selection;
+					let { $from: n } = e.get(P).state.selection;
 					for (let e = n.depth; e > 0; e--) if (n.node(e).type.name === "table") {
 						t = "table";
 						break;
@@ -1166,168 +1880,184 @@ var zt = class {
 				return "text";
 			}
 		}
-		function k(e) {
+		function ce(e) {
 			let t = e.left + e.width / 2, n = e.top - 8;
-			t = Math.max(108, Math.min(t, window.innerWidth - 108)), n < 50 && (n = e.bottom + 8), o.value = {
+			t = Math.max(108, Math.min(t, window.innerWidth - 108)), n < 50 && (n = e.bottom + 8), c.value = {
 				left: `${t}px`,
 				top: `${n}px`
 			};
 		}
-		function A() {
+		function V() {
 			if (e.readonly || e.toolbarMode === "fixed") {
-				a.value = !1;
+				o.value = !1;
 				return;
 			}
 			let t = window.getSelection();
 			if (!t || t.isCollapsed || !t.rangeCount) {
-				a.value = !1, c.value = !1;
+				o.value = !1, u.value = !1;
 				return;
 			}
 			let n = t.getRangeAt(0), r = i.value?.querySelector(".coar-md-area .milkdown");
 			if (!r || !r.contains(n.commonAncestorContainer)) {
-				a.value = !1, c.value = !1;
+				o.value = !1, u.value = !1;
 				return;
 			}
-			k(n.getBoundingClientRect()), s.value = re(), a.value = !0, c.value = !1;
+			ce(n.getBoundingClientRect()), l.value = se(), o.value = !0, u.value = !1;
 		}
-		function j(e) {
+		function W(e) {
 			let t = e.target;
-			t.closest(".coar-md-floating-toolbar") || t.closest(".coar-md-float-submenu") || t.closest(".coar-md-color-picker") || t.closest(".coar-overlay-outlet") || (!i.value || !i.value.contains(t)) && (a.value = !1, c.value = !1);
+			t.closest(".coar-md-floating-toolbar") || t.closest(".coar-md-float-submenu") || t.closest(".coar-md-color-picker") || t.closest(".coar-overlay-outlet") || (!i.value || !i.value.contains(t)) && (o.value = !1, u.value = !1);
 		}
-		let M = null;
-		function N(e = 20) {
+		let G = null;
+		function de(e = 20) {
 			let t = r();
 			if (!t) {
-				e > 0 && setTimeout(() => N(e - 1), 50);
+				e > 0 && setTimeout(() => de(e - 1), 50);
 				return;
 			}
 			try {
 				t.action((e) => {
-					let t = e.get(Je);
-					M = () => queueMicrotask(T), t.selectionUpdated(M);
+					let t = e.get(lt);
+					G = () => queueMicrotask(R), t.selectionUpdated(G);
 				});
 			} catch {
-				e > 0 && setTimeout(() => N(e - 1), 50);
+				e > 0 && setTimeout(() => de(e - 1), 50);
 			}
 		}
-		function oe() {
-			if (!M) return;
+		function me() {
+			if (!G) return;
 			let e = r();
 			if (e) {
 				try {
 					e.action((e) => {
-						let t = e.get(Je).listeners.selectionUpdated, n = t.indexOf(M);
+						let t = e.get(lt).listeners.selectionUpdated, n = t.indexOf(G);
 						n >= 0 && t.splice(n, 1);
 					});
 				} catch {}
-				M = null;
+				G = null;
 			}
 		}
 		g(() => {
-			document.addEventListener("selectionchange", A), document.addEventListener("mousedown", j, !0), N();
-		}), h(() => {
-			document.removeEventListener("selectionchange", A), document.removeEventListener("mousedown", j, !0), oe(), S();
+			document.addEventListener("selectionchange", V), document.addEventListener("mousedown", W, !0), de();
+		}), ee(() => {
+			document.removeEventListener("selectionchange", V), document.removeEventListener("mousedown", W, !0), me(), A();
 		});
-		function L(e, t, n, r = {}) {
-			return u(I, {
+		function q(e, t, n, r = {}) {
+			return d(U, {
 				icon: e,
 				label: t,
 				active: r.active ?? !1,
 				disabled: r.disabled ?? !1,
-				onClick: r.disabled ? () => {} : r.onClick ?? (() => _(n))
+				onClick: r.disabled ? () => {} : r.onClick ?? (() => x(n))
 			});
 		}
-		function R() {
-			let t = m.value, n = t.heading != null;
+		function he() {
+			let t = b.value, n = t.heading != null;
 			function r(e, t, n) {
-				x(t) && e.push(n);
+				D(t) && e.push(n);
 			}
 			function i(e) {
-				e.length !== 0 && e[e.length - 1]?.type !== F && e.push(u(F));
+				e.length !== 0 && e[e.length - 1]?.type !== H && e.push(d(H));
 			}
 			let a = [];
 			if (e.sourceToggle) {
 				let t = e.viewMode === "source";
-				if (a.push(u(I, {
+				if (a.push(d(U, {
 					icon: t ? "eye" : "code",
 					label: t ? "Rendered" : "Source",
 					active: t,
 					onClick: () => e.onToggleView?.(t ? "rendered" : "source")
-				})), t) return z(a);
+				})), t) return ge(a);
 				i(a);
 			}
-			return r(a, "bold", L("bold", "Bold", $.bold, { active: t.strong })), r(a, "italic", L("italic", "Italic", $.italic, { active: t.emphasis })), r(a, "strikethrough", L("strikethrough", "Strikethrough", $.strike, { active: t.strike_through })), r(a, "inlineCode", L("code", "Inline Code", $.code, { active: t.inlineCode })), r(a, "textColor", u(I, {
+			return r(a, "bold", q("bold", "Bold", $.bold, { active: t.strong })), r(a, "italic", q("italic", "Italic", $.italic, { active: t.emphasis })), r(a, "strikethrough", q("strikethrough", "Strikethrough", $.strike, { active: t.strike_through })), r(a, "inlineCode", q("code", "Inline Code", $.code, { active: t.inlineCode })), r(a, "textColor", d(U, {
 				icon: "palette",
 				label: "Text Color",
 				active: t.text_color !== null,
 				onClick: (e) => {
-					te(e.currentTarget ?? e.target);
+					k(e.currentTarget ?? e.target);
 				}
-			})), r(a, "headings", u(ce, {
+			})), r(a, "headings", d(ue, {
 				icon: "hash",
 				label: n ? `Heading ${t.heading}` : "Headings",
 				mode: "flyout",
 				openOnHover: !0
 			}, { default: () => [
-				u(I, {
+				d(U, {
 					icon: "pilcrow",
 					label: "Paragraph",
 					active: !n,
-					onClick: () => _($.paragraph)
+					onClick: () => x($.paragraph)
 				}),
-				u(I, {
+				d(U, {
 					icon: "heading",
 					label: "Heading 1",
 					active: t.heading === 1,
-					onClick: () => _($.h1)
+					onClick: () => x($.h1)
 				}),
-				u(I, {
+				d(U, {
 					icon: "heading",
 					label: "Heading 2",
 					active: t.heading === 2,
-					onClick: () => _($.h2)
+					onClick: () => x($.h2)
 				}),
-				u(I, {
+				d(U, {
 					icon: "heading",
 					label: "Heading 3",
 					active: t.heading === 3,
-					onClick: () => _($.h3)
+					onClick: () => x($.h3)
 				}),
-				u(I, {
+				d(U, {
 					icon: "heading",
 					label: "Heading 4",
 					active: t.heading === 4,
-					onClick: () => _($.h4)
+					onClick: () => x($.h4)
 				}),
-				u(I, {
+				d(U, {
 					icon: "heading",
 					label: "Heading 5",
 					active: t.heading === 5,
-					onClick: () => _($.h5)
+					onClick: () => x($.h5)
 				}),
-				u(I, {
+				d(U, {
 					icon: "heading",
 					label: "Heading 6",
 					active: t.heading === 6,
-					onClick: () => _($.h6)
+					onClick: () => x($.h6)
 				})
-			] })), i(a), r(a, "bulletList", L("list", "Bullet List", $.bulletList, {
+			] })), i(a), r(a, "bulletList", q("list", "Bullet List", $.bulletList, {
 				active: t.bullet_list,
-				onClick: () => y("bullet_list")
-			})), r(a, "orderedList", L("list-ordered", "Ordered List", $.orderedList, {
+				onClick: () => w("bullet_list")
+			})), r(a, "orderedList", q("list-ordered", "Ordered List", $.orderedList, {
 				active: t.ordered_list,
-				onClick: () => y("ordered_list")
-			})), r(a, "taskList", L("clipboard-check", "Task List", $.bulletList, {
+				onClick: () => w("ordered_list")
+			})), r(a, "taskList", q("clipboard-check", "Task List", $.bulletList, {
 				active: t.task_list,
-				onClick: w
-			})), r(a, "outdent", L("indent-decrease", "Outdent", $.outdent, { disabled: t.list_item_depth < 2 })), r(a, "indent", L("indent-increase", "Indent", $.indent, { disabled: t.list_item_depth < 1 })), r(a, "blockquote", L("text-quote", "Blockquote", $.blockquote, { active: t.blockquote })), r(a, "horizontalRule", L("minus", "Horizontal Rule", $.hr)), i(a), r(a, "codeBlock", L("square-code", "Code Block", $.codeBlock, { active: t.code_block })), r(a, "table", L("table", "Insert Table", $.table, { active: t.table })), t.table && x("tableOps") && (i(a), a.push(L("between-vertical-start", "Insert Row Above", $.addRowBefore)), a.push(L("between-vertical-end", "Insert Row Below", $.addRowAfter)), a.push(L("between-horizontal-start", "Insert Column Left", $.addColBefore)), a.push(L("between-horizontal-end", "Insert Column Right", $.addColAfter)), a.push(L("trash-2", "Delete Cell", $.deleteCell))), x("clearFormatting") && (i(a), a.push(L("eraser", "Clear Formatting", $.bold, { onClick: C }))), i(a), r(a, "undo", L("undo-2", "Undo", $.undo)), r(a, "redo", L("redo-2", "Redo", $.redo)), a[a.length - 1]?.type === F && a.pop(), z(a);
+				onClick: L
+			})), r(a, "outdent", q("indent-decrease", "Outdent", $.outdent, { disabled: t.list_item_depth < 2 })), r(a, "indent", q("indent-increase", "Indent", $.indent, { disabled: t.list_item_depth < 1 })), r(a, "blockquote", q("text-quote", "Blockquote", $.blockquote, { active: t.blockquote })), r(a, "horizontalRule", q("minus", "Horizontal Rule", $.hr)), i(a), r(a, "codeBlock", q("square-code", "Code Block", $.codeBlock, { active: t.code_block })), r(a, "table", d(U, {
+				icon: "table",
+				label: "Insert Table",
+				active: t.table,
+				onClick: (e) => {
+					te(e.currentTarget ?? e.target);
+				}
+			})), r(a, "image", q("image", "Insert Image", $.bold, { onClick: re })), t.table && D("tableOps") && (i(a), a.push(q("table-row-plus-above", "Insert Row Above", $.addRowBefore)), a.push(q("table-row-plus-below", "Insert Row Below", $.addRowAfter)), a.push(q("table-column-plus-left", "Insert Column Left", $.addColBefore)), a.push(q("table-column-plus-right", "Insert Column Right", $.addColAfter)), a.push(q("align-left", "Align Left", $.deleteCell, {
+				active: t.cell_alignment === "left",
+				onClick: () => S("left")
+			})), a.push(q("align-center", "Align Center", $.deleteCell, {
+				active: t.cell_alignment === "center",
+				onClick: () => S("center")
+			})), a.push(q("align-right", "Align Right", $.deleteCell, {
+				active: t.cell_alignment === "right",
+				onClick: () => S("right")
+			})), a.push(q("trash-2", "Delete Cell", $.deleteCell)), a.push(q("table", "Delete Table", $.deleteCell, { onClick: C }))), D("clearFormatting") && (i(a), a.push(q("eraser", "Clear Formatting", $.bold, { onClick: ie }))), i(a), r(a, "undo", q("undo-2", "Undo", $.undo)), r(a, "redo", q("redo-2", "Redo", $.redo)), a[a.length - 1]?.type === H && a.pop(), ge(a);
 		}
-		function z(t) {
-			return u("div", {
+		function ge(t) {
+			return d("div", {
 				key: "sidebar",
 				class: "coar-md-sidebar-wrap",
 				onMousedown: (e) => e.preventDefault()
-			}, [u(se, {
+			}, [d(le, {
 				collapsed: !0,
 				side: e.toolbarPosition,
 				size: "s",
@@ -1335,8 +2065,8 @@ var zt = class {
 				borderless: !0
 			}, { default: () => t })]);
 		}
-		function de() {
-			let e = (e, t, n, r = {}) => u("button", {
+		function ye() {
+			let e = (e, t, n, r = {}) => d("button", {
 				class: [
 					"coar-md-float-btn",
 					r.isActive ? "coar-md-float-btn--active" : "",
@@ -1346,45 +2076,45 @@ var zt = class {
 				type: "button",
 				disabled: r.disabled ?? !1,
 				onMousedown: (e) => {
-					e.preventDefault(), !r.disabled && (r.onClick ?? (() => _(n)))();
+					e.preventDefault(), !r.disabled && (r.onClick ?? (() => x(n)))();
 				}
-			}, [u(P, {
+			}, [d(B, {
 				name: e,
 				size: "s"
-			})]), n = () => u("div", { class: "coar-md-float-sep" }), r = m.value;
+			})]), n = () => d("div", { class: "coar-md-float-sep" }), r = b.value;
 			function i(e, t, n) {
-				x(t) && e.push(n);
+				D(t) && e.push(n);
 			}
 			function a(e) {
 				e.length !== 0 && e[e.length - 1]?.props?.class !== "coar-md-float-sep" && e.push(n());
 			}
-			let l = [];
-			if (i(l, "bold", e("bold", "Bold", $.bold, { isActive: r.strong })), i(l, "italic", e("italic", "Italic", $.italic, { isActive: r.emphasis })), i(l, "strikethrough", e("strikethrough", "Strikethrough", $.strike, { isActive: r.strike_through })), i(l, "inlineCode", e("code", "Inline Code", $.code, { isActive: r.inlineCode })), x("textColor")) {
+			let o = [];
+			if (i(o, "bold", e("bold", "Bold", $.bold, { isActive: r.strong })), i(o, "italic", e("italic", "Italic", $.italic, { isActive: r.emphasis })), i(o, "strikethrough", e("strikethrough", "Strikethrough", $.strike, { isActive: r.strike_through })), i(o, "inlineCode", e("code", "Inline Code", $.code, { isActive: r.inlineCode })), D("textColor")) {
 				let e = r.text_color !== null;
-				l.push(u("button", {
+				o.push(d("button", {
 					class: ["coar-md-float-btn", e ? "coar-md-float-btn--active" : ""],
 					type: "button",
 					title: e ? `Text Color (${r.text_color})` : "Text Color",
 					style: e ? `--coar-md-color-indicator: ${r.text_color};` : void 0,
 					onMousedown: (e) => {
-						e.preventDefault(), te(e.currentTarget);
+						e.preventDefault(), k(e.currentTarget);
 					}
-				}, [u(P, {
+				}, [d(B, {
 					name: "palette",
 					size: "s"
 				})]));
 			}
-			x("headings") && (a(l), l.push(u("div", { class: "coar-md-float-dropdown" }, [u("button", {
-				class: ["coar-md-float-btn", c.value || r.heading != null ? "coar-md-float-btn--active" : ""],
+			D("headings") && (a(o), o.push(d("div", { class: "coar-md-float-dropdown" }, [d("button", {
+				class: ["coar-md-float-btn", u.value || r.heading != null ? "coar-md-float-btn--active" : ""],
 				title: r.heading == null ? "Headings" : `Heading ${r.heading}`,
 				type: "button",
 				onMousedown: (e) => {
-					e.preventDefault(), c.value = !c.value;
+					e.preventDefault(), u.value = !u.value;
 				}
-			}, [u(P, {
+			}, [d(B, {
 				name: "heading",
 				size: "s"
-			})]), c.value ? u("div", { class: "coar-md-float-submenu" }, [
+			})]), u.value ? d("div", { class: "coar-md-float-submenu" }, [
 				{
 					label: "Paragraph",
 					cmd: $.paragraph,
@@ -1427,77 +2157,99 @@ var zt = class {
 					icon: "heading",
 					activeLevel: 6
 				}
-			].map(({ label: e, cmd: t, icon: n, activeLevel: i }) => u("button", {
+			].map(({ label: e, cmd: t, icon: n, activeLevel: i }) => d("button", {
 				class: ["coar-md-float-submenu-item", (i === 0 ? r.heading == null : r.heading === i) ? "coar-md-float-submenu-item--active" : ""],
 				type: "button",
 				onMousedown: (e) => {
-					e.preventDefault(), _(t), c.value = !1;
+					e.preventDefault(), x(t), u.value = !1;
 				}
-			}, [u(P, {
+			}, [d(B, {
 				name: n,
 				size: "xs"
-			}), u("span", null, e)]))) : null]))), a(l), i(l, "bulletList", e("list", "Bullet List", $.bulletList, {
+			}), d("span", null, e)]))) : null]))), a(o), i(o, "bulletList", e("list", "Bullet List", $.bulletList, {
 				isActive: r.bullet_list,
-				onClick: () => y("bullet_list")
-			})), i(l, "orderedList", e("list-ordered", "Ordered List", $.orderedList, {
+				onClick: () => w("bullet_list")
+			})), i(o, "orderedList", e("list-ordered", "Ordered List", $.orderedList, {
 				isActive: r.ordered_list,
-				onClick: () => y("ordered_list")
-			})), i(l, "taskList", e("clipboard-check", "Task List", $.bulletList, {
+				onClick: () => w("ordered_list")
+			})), i(o, "taskList", e("clipboard-check", "Task List", $.bulletList, {
 				isActive: r.task_list,
-				onClick: w
-			})), i(l, "outdent", e("indent-decrease", "Outdent", $.outdent, { disabled: r.list_item_depth < 2 })), i(l, "indent", e("indent-increase", "Indent", $.indent, { disabled: r.list_item_depth < 1 })), a(l), i(l, "blockquote", e("text-quote", "Blockquote", $.blockquote, { isActive: r.blockquote })), x("clearFormatting") && (a(l), l.push(e("eraser", "Clear Formatting", $.bold, { onClick: C }))), l[l.length - 1]?.props?.class === "coar-md-float-sep" && l.pop();
-			let d = {
-				text: l,
-				table: x("tableOps") ? [
-					e("between-vertical-start", "Insert Row Above", $.addRowBefore),
-					e("between-vertical-end", "Insert Row Below", $.addRowAfter),
+				onClick: L
+			})), i(o, "outdent", e("indent-decrease", "Outdent", $.outdent, { disabled: r.list_item_depth < 2 })), i(o, "indent", e("indent-increase", "Indent", $.indent, { disabled: r.list_item_depth < 1 })), a(o), i(o, "blockquote", e("text-quote", "Blockquote", $.blockquote, { isActive: r.blockquote })), D("clearFormatting") && (a(o), o.push(e("eraser", "Clear Formatting", $.bold, { onClick: ie }))), o[o.length - 1]?.props?.class === "coar-md-float-sep" && o.pop();
+			let s = {
+				text: o,
+				table: D("tableOps") ? [
+					e("table-row-plus-above", "Insert Row Above", $.addRowBefore),
+					e("table-row-plus-below", "Insert Row Below", $.addRowAfter),
 					n(),
-					e("between-horizontal-start", "Insert Column Left", $.addColBefore),
-					e("between-horizontal-end", "Insert Column Right", $.addColAfter),
+					e("table-column-plus-left", "Insert Column Left", $.addColBefore),
+					e("table-column-plus-right", "Insert Column Right", $.addColAfter),
 					n(),
-					e("trash-2", "Delete", $.deleteCell),
-					...x("bold") || x("italic") || x("inlineCode") ? [n()] : [],
-					...x("bold") ? [e("bold", "Bold", $.bold)] : [],
-					...x("italic") ? [e("italic", "Italic", $.italic)] : [],
-					...x("inlineCode") ? [e("code", "Code", $.code)] : []
-				] : l,
-				"col-selection": x("tableOps") ? [
-					e("between-horizontal-start", "Insert Column Left", $.addColBefore),
-					e("between-horizontal-end", "Insert Column Right", $.addColAfter),
+					e("align-left", "Align Left", $.deleteCell, {
+						isActive: r.cell_alignment === "left",
+						onClick: () => S("left")
+					}),
+					e("align-center", "Align Center", $.deleteCell, {
+						isActive: r.cell_alignment === "center",
+						onClick: () => S("center")
+					}),
+					e("align-right", "Align Right", $.deleteCell, {
+						isActive: r.cell_alignment === "right",
+						onClick: () => S("right")
+					}),
+					n(),
+					e("trash-2", "Delete Cell", $.deleteCell),
+					e("table", "Delete Table", $.deleteCell, { onClick: C }),
+					...D("bold") || D("italic") || D("inlineCode") ? [n()] : [],
+					...D("bold") ? [e("bold", "Bold", $.bold)] : [],
+					...D("italic") ? [e("italic", "Italic", $.italic)] : [],
+					...D("inlineCode") ? [e("code", "Code", $.code)] : []
+				] : o,
+				"col-selection": D("tableOps") ? [
+					e("table-column-plus-left", "Insert Column Left", $.addColBefore),
+					e("table-column-plus-right", "Insert Column Right", $.addColAfter),
 					n(),
 					e("trash-2", "Delete Column", $.deleteCell)
-				] : l,
-				"row-selection": x("tableOps") ? [
-					e("between-vertical-start", "Insert Row Above", $.addRowBefore),
-					e("between-vertical-end", "Insert Row Below", $.addRowAfter),
+				] : o,
+				"row-selection": D("tableOps") ? [
+					e("table-row-plus-above", "Insert Row Above", $.addRowBefore),
+					e("table-row-plus-below", "Insert Row Below", $.addRowAfter),
 					n(),
 					e("trash-2", "Delete Row", $.deleteCell)
-				] : l
+				] : o
 			};
-			return u(t, { to: "body" }, u("div", {
+			return d(t, { to: "body" }, d("div", {
 				class: "coar-md-floating-toolbar",
-				style: `left:${o.value.left};top:${o.value.top};`
-			}, d[s.value] || l));
+				style: `left:${c.value.left};top:${c.value.top};`
+			}, s[l.value] || o));
 		}
 		return () => {
-			let t = e.toolbarMode === "fixed" || e.toolbarMode === "both", n = e.sourceToggle && e.viewMode === "source", r = !e.readonly && !n && (e.toolbarMode === "floating" || e.toolbarMode === "both"), o = [], s = e.toolbarPosition === "left" || e.toolbarPosition === "top", c = e.toolbarPosition === "right" || e.toolbarPosition === "bottom";
-			t && s && o.push(R());
-			let l = e.isEmpty && e.placeholder.length > 0 && !n;
-			return o.push(u("div", {
+			let t = e.toolbarMode === "fixed" || e.toolbarMode === "both", n = e.sourceToggle && e.viewMode === "source", r = !e.readonly && !n && (e.toolbarMode === "floating" || e.toolbarMode === "both"), c = [], l = e.toolbarPosition === "left" || e.toolbarPosition === "top", u = e.toolbarPosition === "right" || e.toolbarPosition === "bottom";
+			t && l && c.push(he());
+			let f = e.isEmpty && e.placeholder.length > 0 && !n;
+			return c.push(d("div", {
 				key: "area",
+				ref: a,
 				class: [
 					"coar-md-area",
 					"coar-markdown",
 					{ "coar-md-area--source": n }
 				],
-				onMousedown: n ? void 0 : E
+				onMousedown: n ? void 0 : oe
 			}, [
-				u(ie),
-				l ? u(yt, {
+				d(ne),
+				f ? d(Rt, {
 					key: "placeholder",
 					source: e.placeholder
 				}) : null,
-				n ? u("textarea", {
+				!e.readonly && !n && E.value.gfm ? d(Dn, {
+					key: "table-handles",
+					area: a.value,
+					onMenuToggle: (e) => {
+						s.value = e;
+					}
+				}) : null,
+				n ? d("textarea", {
 					key: "source",
 					class: "coar-md-source-area",
 					value: e.sourceValue,
@@ -1507,7 +2259,7 @@ var zt = class {
 					placeholder: e.placeholder || void 0,
 					onInput: (t) => e.onSourceInput?.(t.target.value)
 				}) : null,
-				e.sourceToggle && !t ? u("button", {
+				e.sourceToggle && !t ? d("button", {
 					key: "source-corner",
 					class: "coar-md-source-corner",
 					type: "button",
@@ -1516,11 +2268,11 @@ var zt = class {
 					onMousedown: (t) => {
 						t.preventDefault(), e.onToggleView?.(n ? "rendered" : "source");
 					}
-				}, [u(P, {
+				}, [d(B, {
 					name: n ? "eye" : "code",
 					size: "s"
 				})]) : null
-			])), t && c && o.push(R()), a.value && r && o.push(de()), u("div", {
+			])), t && u && c.push(he()), o.value && r && !s.value && c.push(ye()), d("div", {
 				class: {
 					"coar-md-root": !0,
 					[`coar-md-root--toolbar-${e.toolbarPosition}`]: !0,
@@ -1536,10 +2288,10 @@ var zt = class {
 				"aria-readonly": e.readonly && !e.disabled ? "true" : void 0,
 				"aria-required": e.required ? "true" : void 0,
 				"data-name": e.name
-			}, o);
+			}, c);
 		};
 	}
-}), Jt = l({
+}), Bn = u({
 	name: "CoarMarkdownEditor",
 	props: {
 		modelValue: {
@@ -1589,33 +2341,48 @@ var zt = class {
 		tools: {
 			type: Array,
 			default: void 0
+		},
+		flavor: {
+			type: [String, Object],
+			default: void 0
+		},
+		uploadImage: {
+			type: Function,
+			default: void 0
+		},
+		pickImage: {
+			type: Function,
+			default: void 0
 		}
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
 		let r = e.modelValue, i = b({ value: e.modelValue });
-		w(() => e.modelValue, (e) => {
+		D(() => e.modelValue, (e) => {
 			i.value = { value: e };
 		});
-		let a = d(L, void 0), o = `coar-markdown-editor-${ee()}`, s = n(() => e.id || a?.inputId.value || o), c = n(() => e.error || (a?.hasError.value ?? !1)), l = n(() => a?.messageId.value), f = n(() => e.disabled || (a?.disabled.value ?? !1)), p = n(() => e.readonly || f.value);
-		return () => u(j, null, () => u(Kt, {
+		let a = f(G, void 0), o = `coar-markdown-editor-${C()}`, s = n(() => e.id || a?.inputId.value || o), c = n(() => e.error || (a?.hasError.value ?? !1)), l = n(() => a?.messageId.value), u = n(() => e.disabled || (a?.disabled.value ?? !1)), p = n(() => e.readonly || u.value);
+		return () => d(re, null, () => d(Rn, {
 			initialValue: r,
 			externalValue: i.value,
 			readonly: p.value,
-			disabled: f.value,
+			disabled: u.value,
 			sourceToggle: e.sourceToggle,
 			toolbarMode: e.toolbarMode,
 			toolbarPosition: e.toolbarPosition,
 			tools: e.tools,
+			flavor: e.flavor,
 			inputId: s.value,
 			hasError: c.value,
 			describedBy: l.value,
 			name: e.name,
 			required: e.required,
 			placeholder: e.placeholder,
+			uploadImage: e.uploadImage,
+			pickImage: e.pickImage,
 			onMarkdownChange: (e) => t("update:modelValue", e)
 		}));
 	}
 });
 //#endregion
-export { Gt as COAR_MARKDOWN_EDITOR_ALL_TOOLS, Jt as CoarMarkdownEditor };
+export { Ln as COAR_MARKDOWN_EDITOR_ALL_TOOLS, Bn as CoarMarkdownEditor, Ct as resolveCapabilities };