import { Dt as e, H as t, M as n, Mt as r, O as i, Ot as a, P as o, Q as s, S as c, V as l, _ as u, b as d, d as f, g as p, h as m, it as h, m as g, p as _, s as v, t as y, y as ee, z as b } from "./vue.runtime.esm-bundler-DpvJL-nX.js";
import { D as x, l as te, p as ne, r as re } from "./keys-BeW4IrXP.js";
import { t as ie } from "./useI18n-Jp3X6Q0t.js";
import { n as S, t as C } from "./_plugin-vue_export-helper-GRmvIR5A.js";
import { t as ae } from "./check-Om8IxvJb.js";
import { t as oe } from "./chevron-down-SG7QNtDl.js";
import { t as w } from "./loader-circle-IS16T05j.js";
import { t as T } from "./message-circle-3R472hDc.js";
import { t as E } from "./send-DRkFf4hP.js";
import { t as D } from "./trash-2-cEVwp-r_.js";
import { t as O } from "./x-BNc1bVzp.js";
import { n as se } from "./useCloudI18n-D0Fi0hBU.js";
import { t as ce } from "./formatRelativeTime-MungD2xr.js";
var le = S("chevron-up", [["path", {
	d: "m18 15-6-6-6 6",
	key: "153udz"
}]]), ue = S("circle-check", [["circle", {
	cx: "12",
	cy: "12",
	r: "10",
	key: "1mglay"
}], ["path", {
	d: "m9 12 2 2 4-4",
	key: "dzmm74"
}]]), k = S("pencil", [["path", {
	d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z",
	key: "1a8usu"
}], ["path", {
	d: "m15 5 4 4",
	key: "1mk7zo"
}]]), de = S("reply", [["path", {
	d: "M20 18v-2a4 4 0 0 0-4-4H4",
	key: "5vmcpk"
}], ["path", {
	d: "m9 17-5-5 5-5",
	key: "nvlc11"
}]]), fe = {
	key: 0,
	class: "tpl-comments-sidebar tpl:absolute tpl:top-14 tpl:right-0 tpl:bottom-0 tpl:z-panel tpl:flex tpl:w-[360px] tpl:flex-col tpl:border-l tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)]"
}, pe = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3" }, me = { class: "tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text)]" }, he = {
	key: 0,
	class: "tpl:ml-1 tpl:inline-flex tpl:size-5 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-[10px] tpl:font-semibold tpl:bg-[var(--tpl-primary)] tpl:text-[var(--tpl-bg)]"
}, ge = { class: "tpl:flex tpl:gap-1 tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-2" }, _e = { class: "tpl:flex-1 tpl:overflow-y-auto" }, ve = {
	key: 0,
	class: "tpl:flex tpl:h-full tpl:items-center tpl:justify-center"
}, ye = {
	key: 1,
	class: "tpl:flex tpl:h-full tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-3 tpl:px-6 tpl:text-center"
}, be = { class: "tpl:max-w-[240px] tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, xe = {
	key: 2,
	class: "tpl:flex tpl:flex-col tpl:gap-3 tpl:p-3"
}, Se = { class: "tpl-comment-card tpl:rounded-lg tpl:border tpl:px-3.5 tpl:py-3" }, Ce = { class: "tpl:flex tpl:items-start tpl:justify-between tpl:gap-2" }, we = { class: "tpl:flex tpl:items-center tpl:gap-1.5" }, Te = { class: "tpl:text-xs tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Ee = { class: "tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]" }, De = {
	key: 0,
	class: "tpl:text-[10px] tpl:italic tpl:text-[var(--tpl-text-dim)]"
}, Oe = { class: "tpl:flex tpl:items-center tpl:gap-0.5" }, ke = ["title", "onClick"], Ae = ["title", "onClick"], je = ["title", "onClick"], Me = {
	key: 0,
	class: "tpl:mt-1 tpl:flex tpl:items-center tpl:gap-1 tpl:text-[10px] tpl:text-[var(--tpl-primary)]"
}, Ne = {
	key: 0,
	class: "tpl:mt-1 tpl:inline-flex tpl:items-center tpl:gap-1 tpl:rounded tpl:px-1.5 tpl:py-0.5 tpl:text-[10px] tpl:font-medium tpl:bg-[var(--tpl-warning-light)] tpl:text-[var(--tpl-warning)]"
}, Pe = ["onClick"], Fe = {
	key: 2,
	class: "tpl:mt-2"
}, Ie = ["onKeydown"], Le = { class: "tpl:mt-1.5 tpl:flex tpl:gap-1.5" }, Re = ["disabled", "onClick"], ze = {
	key: 3,
	class: "tpl:mt-1.5 tpl:text-xs tpl:leading-relaxed tpl:whitespace-pre-wrap tpl:text-[var(--tpl-text)]"
}, Be = {
	key: 4,
	class: "tpl:mt-2 tpl:flex tpl:items-center tpl:gap-2 tpl:rounded-md tpl:px-2.5 tpl:py-2 tpl:text-xs tpl:bg-[var(--tpl-danger-light)] tpl:text-[var(--tpl-danger)]"
}, Ve = { class: "tpl:flex-1" }, He = ["onClick"], Ue = {
	key: 5,
	class: "tpl:mt-2 tpl:flex tpl:items-center tpl:gap-2"
}, We = ["title", "onClick"], Ge = ["onClick"], Ke = {
	key: 0,
	class: "tpl-comment-replies tpl:ml-5 tpl:pl-3 tpl:pt-2"
}, qe = { class: "tpl:flex tpl:items-start tpl:justify-between tpl:gap-2" }, Je = { class: "tpl:flex tpl:items-center tpl:gap-1.5" }, Ye = { class: "tpl:text-xs tpl:font-semibold tpl:text-[var(--tpl-text)]" }, Xe = { class: "tpl:text-[10px] tpl:text-[var(--tpl-text-dim)]" }, Ze = {
	key: 0,
	class: "tpl:text-[10px] tpl:italic tpl:text-[var(--tpl-text-dim)]"
}, Qe = { class: "tpl:flex tpl:items-center tpl:gap-0.5" }, $e = ["title", "onClick"], et = ["title", "onClick"], tt = {
	key: 0,
	class: "tpl:mt-1.5"
}, nt = ["onKeydown"], rt = { class: "tpl:mt-1.5 tpl:flex tpl:gap-1.5" }, it = ["disabled", "onClick"], at = {
	key: 1,
	class: "tpl:mt-1 tpl:text-xs tpl:leading-relaxed tpl:whitespace-pre-wrap tpl:text-[var(--tpl-text)]"
}, ot = {
	key: 2,
	class: "tpl:mt-2 tpl:flex tpl:items-center tpl:gap-2 tpl:rounded-md tpl:px-2.5 tpl:py-2 tpl:text-xs tpl:bg-[var(--tpl-danger-light)] tpl:text-[var(--tpl-danger)]"
}, st = { class: "tpl:flex-1" }, ct = ["onClick"], lt = {
	key: 0,
	class: "tpl-comment-replies tpl:ml-5 tpl:pl-3 tpl:pt-2"
}, ut = { class: "tpl:flex tpl:items-end tpl:gap-2" }, dt = ["placeholder", "onKeydown"], ft = { class: "tpl:flex tpl:shrink-0 tpl:flex-col tpl:gap-1" }, pt = ["disabled", "onClick"], mt = { class: "tpl:border-t tpl:p-3 tpl:border-[var(--tpl-border)]" }, ht = {
	key: 0,
	class: "tpl:flex tpl:min-h-[68px] tpl:items-center tpl:rounded-md tpl:px-3 tpl:py-2 tpl:text-xs tpl:bg-[var(--tpl-warning-light)] tpl:text-[var(--tpl-warning)]"
}, gt = {
	key: 1,
	class: "tpl-comments-input-wrapper tpl:flex tpl:min-h-[68px] tpl:items-end tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:border tpl:px-3 tpl:py-2 tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]"
}, _t = ["placeholder", "disabled"], vt = ["disabled"], A = /* @__PURE__ */ C(/* @__PURE__ */ c({
	__name: "CommentsSidebar",
	props: { visible: { type: Boolean } },
	emits: ["close", "filterBlock"],
	setup(c, { expose: S, emit: C }) {
		let A = c, j = C, { format: M } = ie(), { t: N } = se(), P = x(ne, "CommentsSidebar"), yt = x(re, "CommentsSidebar"), F = x(te, "CommentsSidebar"), I = s("unresolved"), L = s(null), R = s(""), z = s(null), B = s(""), V = s(null), H = s(""), U = s(/* @__PURE__ */ new Set()), W = s(null), G = s(null), bt = _(() => yt.userConfig?.id ?? null), xt = _(() => {
			let e = /* @__PURE__ */ new Set();
			for (let t of P.content.value.blocks) if (e.add(t.id), t.type === "section") for (let n of t.children) for (let t of n) e.add(t.id);
			return e;
		});
		function St(e) {
			return e ? !xt.value.has(e) : !1;
		}
		let Ct = _(() => I.value !== "block" || !L.value ? !1 : !(P.savedBlockIds?.value.has(L.value) ?? !0)), K = _(() => {
			let e = F.comments.value;
			return I.value === "unresolved" ? e = e.filter((e) => !e.resolved_at) : I.value === "block" && L.value && (e = e.filter((e) => e.block_id === L.value)), e;
		});
		b(() => A.visible, (e) => {
			e && F.loadComments();
		}), b(() => P.state.selectedBlockId, (e) => {
			I.value === "block" && e && (L.value = e);
		});
		function q(e, t) {
			I.value = e, L.value = e === "block" ? t ?? null : null;
		}
		function wt(e) {
			q("block", e), j("filterBlock", e);
		}
		function Tt(e) {
			U.value.has(e) ? U.value.delete(e) : U.value.add(e);
		}
		function Et(e) {
			z.value = e, B.value = "", V.value = null, U.value.has(e) || U.value.add(e);
		}
		function Dt() {
			z.value = null, B.value = "";
		}
		function J(e) {
			V.value = e.id, H.value = e.body, z.value = null;
		}
		function Y() {
			V.value = null, H.value = "";
		}
		function X(e) {
			W.value = e;
		}
		function Ot() {
			W.value = null;
		}
		async function Z() {
			let e = R.value.trim();
			if (!e) return;
			let t = I.value === "block" ? L.value : void 0;
			await F.addComment(e, t ?? void 0), R.value = "";
		}
		async function kt(e) {
			let t = B.value.trim();
			if (!t) return;
			let n = F.comments.value.find((t) => t.id === e);
			await F.addComment(t, n?.block_id ?? void 0, e), z.value = null, B.value = "";
		}
		async function Q(e) {
			let t = H.value.trim();
			t && (await F.editComment(e, t), V.value = null, H.value = "");
		}
		async function At(e) {
			await F.removeComment(e), W.value = null;
		}
		async function jt(e) {
			await F.toggleResolve(e);
		}
		function $(e) {
			return e.author_identifier === bt.value;
		}
		function Mt(e) {
			return ce(e, N.snapshotHistory) ?? e;
		}
		function Nt(e) {
			e.key === "Enter" && !e.shiftKey && (e.preventDefault(), Z());
		}
		function Pt(e, t) {
			e.key === "Enter" && !e.shiftKey && (e.preventDefault(), kt(t));
		}
		function Ft(e, t) {
			e.key === "Enter" && !e.shiftKey && (e.preventDefault(), Q(t)), e.key === "Escape" && Y();
		}
		function It() {
			i(() => {
				G.value?.focus();
			});
		}
		return S({
			filterByBlock: wt,
			focusNewComment: It
		}), (i, s) => (n(), m(y, {
			"enter-active-class": "tpl-comments-slide-enter-active",
			"enter-from-class": "tpl:translate-x-full",
			"enter-to-class": "tpl:translate-x-0",
			"leave-active-class": "tpl-comments-slide-leave-active",
			"leave-from-class": "tpl:translate-x-0",
			"leave-to-class": "tpl:translate-x-full"
		}, {
			default: l(() => [c.visible ? (n(), u("div", fe, [
				g("div", pe, [g("div", me, [
					d(h(T), {
						size: 13,
						"stroke-width": 2
					}),
					g("span", null, r(h(N).comments.title), 1),
					h(F).unresolvedCount.value > 0 ? (n(), u("span", he, r(h(F).unresolvedCount.value), 1)) : p("", !0)
				]), g("button", {
					class: "tpl:rounded-md tpl:p-0.5 tpl:transition-colors tpl:duration-150 tpl:text-[var(--tpl-text-muted)]",
					onClick: s[0] ||= (e) => j("close")
				}, [d(h(O), {
					size: 14,
					"stroke-width": 2
				})])]),
				g("div", ge, [
					g("button", {
						class: e(["tpl-comment-filter tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:transition-colors tpl:duration-150", I.value === "unresolved" ? "tpl-comment-filter--active" : ""]),
						onClick: s[1] ||= (e) => q("unresolved")
					}, r(h(N).comments.filterUnresolved), 3),
					g("button", {
						class: e(["tpl-comment-filter tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:transition-colors tpl:duration-150", I.value === "all" ? "tpl-comment-filter--active" : ""]),
						onClick: s[2] ||= (e) => q("all")
					}, r(h(N).comments.filterAll), 3),
					h(P).state.selectedBlockId ? (n(), u("button", {
						key: 0,
						class: e(["tpl-comment-filter tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:transition-colors tpl:duration-150", I.value === "block" ? "tpl-comment-filter--active" : ""]),
						onClick: s[3] ||= (e) => q("block", h(P).state.selectedBlockId ?? void 0)
					}, r(h(N).comments.filterBlock), 3)) : p("", !0)
				]),
				g("div", _e, [h(F).isLoading.value ? (n(), u("div", ve, [d(h(w), {
					class: "tpl-spinner tpl:text-[var(--tpl-text-muted)]",
					size: 24,
					"stroke-width": 2
				})])) : K.value.length === 0 ? (n(), u("div", ye, [d(h(T), {
					size: 32,
					"stroke-width": 1.5,
					class: "tpl:text-[var(--tpl-text-dim)]"
				}), g("p", be, r(I.value === "all" ? h(N).comments.noCommentsHint : h(N).comments.noComments), 1)])) : (n(), u("div", xe, [(n(!0), u(f, null, o(K.value, (i) => (n(), u("div", {
					key: i.id,
					class: "tpl-comment-thread"
				}, [
					g("div", Se, [
						g("div", Ce, [g("div", we, [
							g("span", Te, r($(i) ? h(N).comments.ownedByYou : i.author_name), 1),
							g("span", Ee, r(Mt(i.created_at)), 1),
							i.updated_at === i.created_at ? p("", !0) : (n(), u("span", De, " (" + r(h(N).comments.edited) + ") ", 1))
						]), g("div", Oe, [
							g("button", {
								class: "tpl-comment-action tpl:rounded tpl:p-1 tpl:transition-colors tpl:duration-150",
								title: i.resolved_at ? h(N).comments.unresolve : h(N).comments.resolve,
								onClick: (e) => jt(i.id)
							}, [d(h(ue), {
								size: 13,
								"stroke-width": 2,
								class: "tpl-resolve-icon",
								style: a({ color: i.resolved_at ? "var(--tpl-primary)" : void 0 })
							}, null, 8, ["style"])], 8, ke),
							$(i) ? (n(), u("button", {
								key: 0,
								class: "tpl-comment-action tpl:rounded tpl:p-1 tpl:transition-colors tpl:duration-150",
								title: h(N).comments.edit,
								onClick: (e) => J(i)
							}, [d(h(k), {
								size: 12,
								"stroke-width": 2
							})], 8, Ae)) : p("", !0),
							$(i) ? (n(), u("button", {
								key: 1,
								class: "tpl-comment-action tpl-comment-delete tpl:rounded tpl:p-1 tpl:transition-colors tpl:duration-150",
								title: h(N).comments.delete,
								onClick: (e) => X(i.id)
							}, [d(h(D), {
								size: 12,
								"stroke-width": 2
							})], 8, je)) : p("", !0)
						])]),
						d(y, { name: "tpl-resolve" }, {
							default: l(() => [i.resolved_at ? (n(), u("div", Me, [d(h(ae), {
								size: 10,
								"stroke-width": 2.5
							}), g("span", null, r(h(M)(h(N).comments.resolvedBy, { name: i.resolved_by_name ?? "" })), 1)])) : p("", !0)]),
							_: 2
						}, 1024),
						i.block_id && St(i.block_id) ? (n(), u("span", Ne, r(h(N).comments.missingBlock), 1)) : i.block_id ? (n(), u("button", {
							key: 1,
							class: "tpl:mt-1 tpl:inline-flex tpl:items-center tpl:gap-1 tpl:rounded tpl:px-1.5 tpl:py-0.5 tpl:text-[10px] tpl:font-medium tpl:transition-colors tpl:duration-150 tpl:bg-[var(--tpl-bg-hover)] tpl:text-[var(--tpl-text-muted)]",
							onClick: (e) => h(P).selectBlock(i.block_id ?? "")
						}, " Block ", 8, Pe)) : p("", !0),
						V.value === i.id ? (n(), u("div", Fe, [t(g("textarea", {
							"onUpdate:modelValue": s[4] ||= (e) => H.value = e,
							class: "tpl:w-full tpl:resize-none tpl:rounded-md tpl:border tpl:px-2.5 tpl:py-2 tpl:font-sans tpl:text-xs tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
							rows: "3",
							onKeydown: (e) => Ft(e, i.id)
						}, null, 40, Ie), [[v, H.value]]), g("div", Le, [g("button", {
							class: "tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:transition-colors tpl:duration-150 tpl:bg-[var(--tpl-primary)] tpl:text-[var(--tpl-bg)]",
							disabled: !H.value.trim() || h(F).isSubmitting.value,
							onClick: (e) => Q(i.id)
						}, r(h(N).comments.save), 9, Re), g("button", {
							class: "tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:transition-colors tpl:duration-150 tpl:text-[var(--tpl-text-muted)]",
							onClick: s[5] ||= (e) => Y()
						}, r(h(N).comments.cancel), 1)])])) : (n(), u("p", ze, r(i.body), 1)),
						W.value === i.id ? (n(), u("div", Be, [
							g("span", Ve, r(h(N).comments.deleteConfirm), 1),
							g("button", {
								class: "tpl:rounded tpl:px-2 tpl:py-0.5 tpl:text-xs tpl:font-medium tpl:bg-[var(--tpl-danger)] tpl:text-[var(--tpl-bg)]",
								onClick: (e) => At(i.id)
							}, r(h(N).comments.delete), 9, He),
							g("button", {
								class: "tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
								onClick: s[6] ||= (e) => Ot()
							}, r(h(N).comments.cancel), 1)
						])) : p("", !0),
						V.value !== i.id && W.value !== i.id ? (n(), u("div", Ue, [g("button", {
							class: "tpl-comment-action tpl:rounded tpl:p-1 tpl:transition-colors tpl:duration-150",
							title: h(N).comments.reply,
							onClick: (e) => Et(i.id)
						}, [d(h(de), {
							size: 13,
							"stroke-width": 2,
							class: "tpl:text-[var(--tpl-primary)]"
						})], 8, We), (i.replies?.length ?? 0) > 0 ? (n(), u("button", {
							key: 0,
							class: "tpl:flex tpl:items-center tpl:gap-0.5 tpl:text-[11px] tpl:font-medium tpl:transition-colors tpl:duration-150 tpl:text-[var(--tpl-text-muted)]",
							onClick: (e) => Tt(i.id)
						}, [U.value.has(i.id) ? (n(), m(h(le), {
							key: 0,
							size: 11,
							"stroke-width": 2
						})) : (n(), m(h(oe), {
							key: 1,
							size: 11,
							"stroke-width": 2
						})), ee(" " + r((i.replies?.length ?? 0) === 1 ? h(M)(h(N).comments.replyOne, { count: String(i.replies?.length ?? 0) }) : h(M)(h(N).comments.replyMany, { count: String(i.replies?.length ?? 0) })), 1)], 8, Ge)) : p("", !0)])) : p("", !0)
					]),
					d(y, { name: "tpl-replies" }, {
						default: l(() => [U.value.has(i.id) && (i.replies?.length ?? 0) > 0 ? (n(), u("div", Ke, [(n(!0), u(f, null, o(i.replies, (a, o) => (n(), u("div", {
							key: a.id,
							class: e(["tpl-comment-reply-card tpl:relative tpl:rounded-lg tpl:border tpl:px-3.5 tpl:py-2.5", o < (i.replies?.length ?? 0) - 1 ? "tpl:mb-2" : ""])
						}, [
							g("div", qe, [g("div", Je, [
								g("span", Ye, r($(a) ? h(N).comments.ownedByYou : a.author_name), 1),
								g("span", Xe, r(Mt(a.created_at)), 1),
								a.updated_at === a.created_at ? p("", !0) : (n(), u("span", Ze, " (" + r(h(N).comments.edited) + ") ", 1))
							]), g("div", Qe, [$(a) ? (n(), u("button", {
								key: 0,
								class: "tpl-comment-action tpl:rounded tpl:p-1 tpl:transition-colors tpl:duration-150",
								title: h(N).comments.edit,
								onClick: (e) => J(a)
							}, [d(h(k), {
								size: 11,
								"stroke-width": 2
							})], 8, $e)) : p("", !0), $(a) ? (n(), u("button", {
								key: 1,
								class: "tpl-comment-action tpl-comment-delete tpl:rounded tpl:p-1 tpl:transition-colors tpl:duration-150",
								title: h(N).comments.delete,
								onClick: (e) => X(a.id)
							}, [d(h(D), {
								size: 11,
								"stroke-width": 2
							})], 8, et)) : p("", !0)])]),
							V.value === a.id ? (n(), u("div", tt, [t(g("textarea", {
								"onUpdate:modelValue": s[7] ||= (e) => H.value = e,
								class: "tpl:w-full tpl:resize-none tpl:rounded-md tpl:border tpl:px-2.5 tpl:py-2 tpl:font-sans tpl:text-xs tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
								rows: "2",
								onKeydown: (e) => Ft(e, a.id)
							}, null, 40, nt), [[v, H.value]]), g("div", rt, [g("button", {
								class: "tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:bg-[var(--tpl-primary)] tpl:text-[var(--tpl-bg)]",
								disabled: !H.value.trim() || h(F).isSubmitting.value,
								onClick: (e) => Q(a.id)
							}, r(h(N).comments.save), 9, it), g("button", {
								class: "tpl:rounded-md tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
								onClick: s[8] ||= (e) => Y()
							}, r(h(N).comments.cancel), 1)])])) : (n(), u("p", at, r(a.body), 1)),
							W.value === a.id ? (n(), u("div", ot, [
								g("span", st, r(h(N).comments.deleteConfirm), 1),
								g("button", {
									class: "tpl:rounded tpl:px-2 tpl:py-0.5 tpl:text-xs tpl:font-medium tpl:bg-[var(--tpl-danger)] tpl:text-[var(--tpl-bg)]",
									onClick: (e) => At(a.id)
								}, r(h(N).comments.delete), 9, ct),
								g("button", {
									class: "tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text-muted)]",
									onClick: s[9] ||= (e) => Ot()
								}, r(h(N).comments.cancel), 1)
							])) : p("", !0)
						], 2))), 128))])) : p("", !0)]),
						_: 2
					}, 1024),
					d(y, { name: "tpl-replies" }, {
						default: l(() => [z.value === i.id ? (n(), u("div", lt, [g("div", ut, [t(g("textarea", {
							"onUpdate:modelValue": s[10] ||= (e) => B.value = e,
							class: "tpl:flex-1 tpl:resize-none tpl:rounded-md tpl:border tpl:px-2.5 tpl:py-2 tpl:font-sans tpl:text-xs tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]",
							placeholder: h(N).comments.replyPlaceholder,
							rows: "2",
							onKeydown: (e) => Pt(e, i.id)
						}, null, 40, dt), [[v, B.value]]), g("div", ft, [g("button", {
							class: "tpl:flex tpl:items-center tpl:justify-center tpl:rounded-md tpl:p-1.5 tpl:transition-colors tpl:duration-150 tpl:disabled:opacity-40 tpl:text-[var(--tpl-primary)]",
							disabled: !B.value.trim() || h(F).isSubmitting.value,
							onClick: (e) => kt(i.id)
						}, [d(h(E), {
							size: 14,
							"stroke-width": 2
						})], 8, pt), g("button", {
							class: "tpl:flex tpl:items-center tpl:justify-center tpl:rounded-md tpl:p-1.5 tpl:transition-colors tpl:duration-150 tpl:text-[var(--tpl-text-muted)]",
							onClick: s[11] ||= (e) => Dt()
						}, [d(h(O), {
							size: 14,
							"stroke-width": 2
						})])])])])) : p("", !0)]),
						_: 2
					}, 1024)
				]))), 128))]))]),
				g("div", mt, [Ct.value ? (n(), u("div", ht, r(h(N).comments.saveTemplateFirst), 1)) : (n(), u("div", gt, [t(g("textarea", {
					ref_key: "newCommentInput",
					ref: G,
					"onUpdate:modelValue": s[12] ||= (e) => R.value = e,
					class: "tpl:max-h-24 tpl:min-h-[48px] tpl:flex-1 tpl:resize-none tpl:border-none tpl:bg-transparent tpl:font-sans tpl:text-xs tpl:outline-none tpl:text-[var(--tpl-text)]",
					placeholder: h(N).comments.placeholder,
					disabled: h(F).isSubmitting.value,
					rows: "2",
					onKeydown: Nt
				}, null, 40, _t), [[v, R.value]]), g("button", {
					class: "tpl-comments-send-btn tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-center tpl:rounded-md tpl:p-1.5 tpl:transition-all tpl:duration-150 tpl:disabled:opacity-40 tpl:text-[var(--tpl-primary)]",
					disabled: !R.value.trim() || h(F).isSubmitting.value,
					onClick: Z
				}, [h(F).isSubmitting.value ? (n(), m(h(w), {
					key: 0,
					class: "tpl-spinner",
					size: 16,
					"stroke-width": 2
				})) : (n(), m(h(E), {
					key: 1,
					size: 16,
					"stroke-width": 2
				}))], 8, vt)]))])
			])) : p("", !0)]),
			_: 1
		}));
	}
}), [["__scopeId", "data-v-d204f573"]]);
//#endregion
export { A as default };
