import { K as e, L as t, M as n, P as r, T as i, Z as a, c as o, ct as s, d as c, f as l, g as u, h as d, it as f, l as p, m, ot as h, p as g, st as _, u as v, v as y, x as b, y as x } from "./draggable-BwWMFq33.js";
import { Ft as S, Jt as C, Q as w, Y as T, a as E, en as D, nn as ee, nt as O, rn as k, rt as A, tn as j, vt as M } from "./features-CUYy5kZQ.js";
import { R as N, U as te, V as ne, Z as re, _ as P, c as ie, f as ae, i as oe, o as F, p as I, s as L, u as R, w as z, x as B, z as V } from "./icons-C4zY5-I3.js";
import { a as H, o as U, s as W } from "./styleConstants-lGobwiLH.js";
import { n as G, t as K } from "./RichTextEditorContent-DU0gc4bi.js";
//#region src/components/blocks/EmojiPickerDropdown.vue?vue&type=script&setup=true&lang.ts
var q = [
	"aria-label",
	"title",
	"aria-expanded"
], J = ["aria-label"], Y = { class: "tpl:mb-1.5 tpl:text-[10px] tpl:font-medium tpl:tracking-wide tpl:text-[var(--tpl-text-muted)] tpl:uppercase" }, se = { class: "tpl:grid tpl:grid-cols-10 tpl:gap-0.5" }, ce = ["aria-label", "onClick"], le = /* @__PURE__ */ b({
	__name: "EmojiPickerDropdown",
	emits: ["insert"],
	setup(e, { emit: t }) {
		let i = t, { categories: c, isOpen: m, toggle: _, close: y } = w(), { t: b, format: C } = S(), T = a(null), E = a(null);
		O(T, l(() => m.value)), k(E, () => {
			m.value && y();
		});
		function D(e) {
			i("insert", e), y();
		}
		return (e, t) => (n(), u("div", {
			ref_key: "rootRef",
			ref: E,
			class: "tpl:relative"
		}, [g("button", {
			type: "button",
			class: h(["tpl-text-toolbar-btn", { "tpl-text-toolbar-btn--active": f(m) }]),
			"aria-label": f(b).paragraphEditor.insertEmoji,
			title: f(b).paragraphEditor.insertEmoji,
			"aria-expanded": f(m),
			"aria-haspopup": "dialog",
			"aria-controls": "tpl-emoji-picker",
			onClick: t[0] ||= (...e) => f(_) && f(_)(...e)
		}, [x(f(P), {
			size: 16,
			"stroke-width": 2
		})], 10, q), f(m) ? (n(), u("div", {
			key: 0,
			id: "tpl-emoji-picker",
			ref_key: "pickerRef",
			ref: T,
			role: "dialog",
			"aria-modal": "false",
			"aria-label": f(b).paragraphEditor.insertEmoji,
			tabindex: "-1",
			class: "tpl-emoji-picker tpl:absolute tpl:top-full tpl:left-0 tpl:z-10 tpl:mt-2 tpl:w-72 tpl:rounded-lg tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-2 tpl:shadow-lg",
			onKeydown: t[1] ||= o(p((...e) => f(y) && f(y)(...e), ["stop", "prevent"]), ["esc"])
		}, [(n(!0), u(v, null, r(f(c), (e) => (n(), u("div", {
			key: e.key,
			class: "tpl:mb-2 tpl:last:mb-0"
		}, [g("div", Y, s(f(b).emoji[e.key]), 1), g("div", se, [(n(!0), u(v, null, r(e.emojis, (e) => (n(), u("button", {
			key: e,
			type: "button",
			"aria-label": f(C)(f(b).paragraphEditor.emojiItemLabel, { emoji: e }),
			class: "tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:border-none tpl:bg-transparent tpl:text-base tpl:transition-all tpl:duration-100 tpl:hover:scale-125 tpl:hover:bg-[var(--tpl-bg-active)]",
			onClick: (t) => D(e)
		}, s(e), 9, ce))), 128))])]))), 128))], 40, J)) : d("", !0)], 512));
	}
}), ue = [
	"aria-label",
	"title",
	"aria-pressed"
], X = /* @__PURE__ */ b({
	__name: "ToolbarIconButton",
	props: {
		icon: {},
		label: {},
		active: { type: Boolean },
		strokeWidth: {},
		size: {}
	},
	setup(e) {
		return (r, i) => (n(), u("button", {
			type: "button",
			class: h(["tpl-text-toolbar-btn", { "tpl-text-toolbar-btn--active": e.active }]),
			"aria-label": e.label,
			title: e.label,
			"aria-pressed": e.active ? "true" : "false"
		}, [(n(), m(t(e.icon), {
			size: e.size ?? 16,
			"stroke-width": e.strokeWidth ?? 2
		}, null, 8, ["size", "stroke-width"]))], 10, ue));
	}
}), de = {}, fe = {
	class: "tpl:mx-1 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]",
	"aria-hidden": "true"
};
function pe(e, t) {
	return n(), u("span", fe);
}
var Z = /* @__PURE__ */ A(de, [["render", pe]]), me = [
	"value",
	"aria-label",
	"title"
], he = { value: "" }, ge = ["value"], Q = /* @__PURE__ */ b({
	__name: "ToolbarSelect",
	props: {
		modelValue: {},
		options: {},
		label: {},
		placeholder: {},
		widthClass: {}
	},
	emits: ["update:modelValue"],
	setup(e, { emit: t }) {
		let i = t;
		function a(e) {
			i("update:modelValue", e.target.value);
		}
		function o(e) {
			return typeof e == "string" ? e : e.value;
		}
		function c(e) {
			return typeof e == "string" ? e : e.label;
		}
		return (t, i) => (n(), u("select", {
			class: h(["tpl:h-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text)] tpl:outline-none", e.widthClass ?? "tpl:w-20"]),
			value: e.modelValue,
			"aria-label": e.label,
			title: e.label,
			onChange: a
		}, [g("option", he, s(e.placeholder ?? ""), 1), (n(!0), u(v, null, r(e.options, (e) => (n(), u("option", {
			key: o(e),
			value: o(e)
		}, s(c(e)), 9, ge))), 128))], 42, me));
	}
}), _e = ["data-tpl-theme", "aria-label"], ve = { class: "tpl:flex tpl:items-center tpl:gap-1" }, ye = { class: "tpl:relative" }, be = [
	"value",
	"aria-label",
	"title"
], $ = { class: "tpl:relative" }, xe = [
	"value",
	"aria-label",
	"title"
], Se = { class: "tpl:flex tpl:items-center tpl:gap-1" }, Ce = ["aria-label", "title"], we = {
	key: 1,
	class: "tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]"
}, Te = /* @__PURE__ */ b({
	__name: "ParagraphToolbar",
	props: {
		editor: {},
		toolbarPosition: {},
		isLoading: { type: Boolean },
		canRequestMergeTag: { type: Boolean }
	},
	emits: ["open-link-dialog", "add-merge-tag"],
	setup(e, { emit: t }) {
		let r = e, a = t, o = i(D, null), l = i(j, null), p = ee(C, "ParagraphToolbar"), h = E(), { t: b } = S(), w = p.fonts;
		function T(e) {
			r.editor?.chain().focus().insertContent(e).run();
		}
		function O(e) {
			return r.editor?.getAttributes("textStyle")[e] || "";
		}
		function k(e) {
			let t = r.editor?.chain().focus();
			e ? t?.setFontFamily(e).run() : t?.unsetFontFamily().run();
		}
		function A(e) {
			let t = r.editor?.chain().focus();
			e ? t?.setFontSize(e).run() : t?.unsetFontSize().run();
		}
		function P(e) {
			let t = r.editor?.chain().focus();
			e ? t?.setColor(e).run() : t?.unsetColor().run();
		}
		function G() {
			return r.editor?.getAttributes("paragraph").lineHeight || "";
		}
		function K(e) {
			let t = r.editor?.chain().focus();
			e ? t?.setLineHeight(e).run() : t?.unsetLineHeight().run();
		}
		function q(e) {
			let t = r.editor?.chain().focus();
			e && e !== "normal" ? t?.setLetterSpacing(e).run() : t?.unsetLetterSpacing().run();
		}
		function J() {
			return r.editor?.getAttributes("highlight").color || "";
		}
		function Y(e) {
			let t = r.editor?.chain().focus();
			e ? t?.setHighlight({ color: e }).run() : t?.unsetHighlight().run();
		}
		return (t, r) => f(h) ? (n(), m(c, {
			key: 0,
			to: f(h)
		}, [g("div", {
			"data-tpl-theme": f(l),
			role: "toolbar",
			"aria-label": f(b).paragraphEditor.toolbar,
			class: "tpl tpl-text-toolbar tpl:fixed tpl:z-popover tpl:flex tpl:gap-1 tpl:rounded-lg tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:px-3 tpl:py-2 tpl:shadow-lg",
			style: _({
				...f(o),
				top: `${e.toolbarPosition.top}px`,
				left: `${e.toolbarPosition.left}px`,
				transform: "translateY(-100%)",
				flexDirection: "column"
			})
		}, [!e.isLoading && e.editor ? (n(), u(v, { key: 0 }, [g("div", ve, [
			x(Q, {
				"model-value": O("fontFamily"),
				options: f(w),
				label: f(b).paragraphEditor.fontFamily,
				placeholder: f(b).paragraphEditor.defaultFont,
				"width-class": "tpl:w-32",
				"onUpdate:modelValue": k
			}, null, 8, [
				"model-value",
				"options",
				"label",
				"placeholder"
			]),
			x(Q, {
				"model-value": O("fontSize"),
				options: f(H),
				label: f(b).paragraphEditor.fontSize,
				placeholder: f(b).paragraphEditor.defaultSize,
				"width-class": "tpl:w-20",
				"onUpdate:modelValue": A
			}, null, 8, [
				"model-value",
				"options",
				"label",
				"placeholder"
			]),
			x(Z),
			g("div", ye, [g("input", {
				type: "color",
				class: "tpl:size-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:p-1",
				value: O("color") || f("#000000"),
				"aria-label": f(b).paragraphEditor.textColor,
				title: f(b).paragraphEditor.textColor,
				onInput: r[0] ||= (e) => P(e.target.value)
			}, null, 40, be)]),
			g("div", $, [g("input", {
				type: "color",
				class: "tpl:size-8 tpl:cursor-pointer tpl:rounded tpl:border tpl:border-[var(--tpl-border)] tpl:p-1",
				style: _({ backgroundColor: J() || "var(--tpl-bg)" }),
				value: J() || f("#ffff00"),
				"aria-label": f(b).paragraphEditor.highlightColor,
				title: f(b).paragraphEditor.highlightColor,
				onInput: r[1] ||= (e) => Y(e.target.value)
			}, null, 44, xe)]),
			x(Z),
			x(X, {
				icon: f(re),
				label: f(b).paragraphEditor.bold,
				active: e.editor.isActive("bold"),
				"stroke-width": 2.5,
				onClick: r[2] ||= (t) => e.editor.chain().focus().toggleBold().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(te),
				label: f(b).paragraphEditor.italic,
				active: e.editor.isActive("italic"),
				onClick: r[3] ||= (t) => e.editor.chain().focus().toggleItalic().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(oe),
				label: f(b).paragraphEditor.underline,
				active: e.editor.isActive("underline"),
				onClick: r[4] ||= (t) => e.editor.chain().focus().toggleUnderline().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(I),
				label: f(b).paragraphEditor.strikethrough,
				active: e.editor.isActive("strike"),
				onClick: r[5] ||= (t) => e.editor.chain().focus().toggleStrike().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(Z),
			x(X, {
				icon: f(ae),
				label: f(b).paragraphEditor.subscript,
				active: e.editor.isActive("subscript"),
				onClick: r[6] ||= (t) => e.editor.chain().focus().toggleSubscript().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(R),
				label: f(b).paragraphEditor.superscript,
				active: e.editor.isActive("superscript"),
				onClick: r[7] ||= (t) => e.editor.chain().focus().toggleSuperscript().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(Z),
			x(X, {
				icon: f(ne),
				label: f(b).paragraphEditor.addLink,
				active: e.editor.isActive("link"),
				onClick: r[8] ||= (e) => a("open-link-dialog")
			}, null, 8, [
				"icon",
				"label",
				"active"
			])
		]), g("div", Se, [
			x(X, {
				icon: f(N),
				label: f(b).paragraphEditor.bulletList,
				active: e.editor.isActive("bulletList"),
				onClick: r[9] ||= (t) => e.editor.chain().focus().toggleBulletList().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(V),
				label: f(b).paragraphEditor.numberedList,
				active: e.editor.isActive("orderedList"),
				onClick: r[10] ||= (t) => e.editor.chain().focus().toggleOrderedList().run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(Z),
			x(X, {
				icon: f(L),
				label: f(b).paragraphEditor.alignLeft,
				active: e.editor.isActive({ textAlign: "left" }),
				onClick: r[11] ||= (t) => e.editor.chain().focus().setTextAlign("left").run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(ie),
				label: f(b).paragraphEditor.alignCenter,
				active: e.editor.isActive({ textAlign: "center" }),
				onClick: r[12] ||= (t) => e.editor.chain().focus().setTextAlign("center").run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(X, {
				icon: f(F),
				label: f(b).paragraphEditor.alignRight,
				active: e.editor.isActive({ textAlign: "right" }),
				onClick: r[13] ||= (t) => e.editor.chain().focus().setTextAlign("right").run()
			}, null, 8, [
				"icon",
				"label",
				"active"
			]),
			x(Z),
			x(Q, {
				"model-value": G(),
				options: f(W),
				label: f(b).paragraphEditor.lineHeight,
				placeholder: "LH",
				"width-class": "tpl:w-16",
				"onUpdate:modelValue": K
			}, null, 8, [
				"model-value",
				"options",
				"label"
			]),
			x(Q, {
				"model-value": O("letterSpacing"),
				options: f(U),
				label: f(b).paragraphEditor.letterSpacing,
				placeholder: "LS",
				"width-class": "tpl:w-20",
				"onUpdate:modelValue": q
			}, null, 8, [
				"model-value",
				"options",
				"label"
			]),
			x(Z),
			x(X, {
				icon: f(z),
				label: f(b).paragraphEditor.clearFormatting,
				onClick: r[14] ||= (t) => e.editor.chain().focus().clearNodes().unsetAllMarks().run()
			}, null, 8, ["icon", "label"]),
			x(Z),
			x(le, { onInsert: T }),
			e.canRequestMergeTag ? (n(), u(v, { key: 0 }, [x(Z), g("button", {
				type: "button",
				class: "tpl:flex tpl:h-8 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded tpl:border-none tpl:bg-transparent tpl:px-2.5 tpl:text-xs tpl:font-medium tpl:text-[var(--tpl-text)] tpl:transition-all tpl:duration-150 tpl:hover:bg-[var(--tpl-bg-active)]",
				"aria-label": f(b).mergeTag.insert,
				title: f(b).mergeTag.insert,
				onClick: r[15] ||= (e) => a("add-merge-tag")
			}, [x(f(B), {
				size: 16,
				"stroke-width": 2
			}), y(" " + s(f(b).mergeTag.insert), 1)], 8, Ce)], 64)) : d("", !0)
		])], 64)) : (n(), u("div", we, [x(f(M), {
			class: "tpl-spinner",
			size: 14,
			"stroke-width": 2
		}), y(" " + s(f(b).errors.editorLoading), 1)]))], 12, _e)], 8, ["to"])) : d("", !0);
	}
}), Ee = { class: "tpl-text-editor-wrapper tpl:relative" }, De = /* @__PURE__ */ b({
	__name: "ParagraphEditor",
	props: {
		block: {},
		toolbarPosition: {}
	},
	emits: ["done"],
	setup(t, { emit: r }) {
		let i = t, a = r, o = E(), { editor: s, EditorContent: c, isLoading: l, initError: d, retry: p, showLinkDialog: m, linkUrl: h, linkDialogRef: g, canRequestMergeTag: _, openLinkDialog: v, insertLink: y, removeLink: b, closeLinkDialog: S, handleLinkKeydown: C, handleAddMergeTag: w } = T({
			blockId: () => i.block.id,
			blockContent: () => i.block.content,
			onDone: () => a("done"),
			editorName: "ParagraphEditor",
			async loadExtensions({ mergeTags: e, syntax: t, triggerChar: n, autocompleteEnabled: r, suggestionEmptyText: i }) {
				let [{ Editor: a, EditorContent: s }, { default: c }, { default: l }, { default: u }, { default: d }, { default: f }, { default: p }, { TextStyle: m }, { default: h }, { default: g }, { default: _ }, { MergeTagNode: v, MergeTagSuggestion: y, LogicMergeTagNode: b, FontSize: x, LineHeight: S, LetterSpacing: C }] = await Promise.all([
					import("./tiptap-BErAJEvo.js").then((e) => e.i),
					import("./tiptap-BErAJEvo.js").then((e) => e.a),
					import("./tiptap-BErAJEvo.js").then((e) => e.u),
					import("./tiptap-BErAJEvo.js").then((e) => e.o),
					import("./tiptap-BErAJEvo.js").then((e) => e.l),
					import("./tiptap-BErAJEvo.js").then((e) => e.c),
					import("./tiptap-BErAJEvo.js").then((e) => e.s),
					import("./tiptap-BErAJEvo.js").then((e) => e.m),
					import("./tiptap-BErAJEvo.js").then((e) => e.p),
					import("./tiptap-BErAJEvo.js").then((e) => e.f),
					import("./tiptap-BErAJEvo.js").then((e) => e.d),
					import("./extensions-CvCoOuWB.js")
				]);
				return {
					TiptapEditor: a,
					EC: s,
					extensions: [
						c.configure({
							heading: !1,
							codeBlock: !1,
							blockquote: !1,
							horizontalRule: !1
						}),
						u,
						d,
						f,
						l.configure({
							openOnClick: !1,
							HTMLAttributes: {
								target: "_blank",
								rel: "noopener noreferrer"
							}
						}),
						p.configure({ types: ["paragraph"] }),
						m,
						h,
						g,
						_.configure({ multicolor: !0 }),
						x,
						S,
						C,
						v.configure({
							mergeTags: e,
							syntax: t
						}),
						b.configure({ syntax: t }),
						...r && n && e.length > 0 ? [y.configure({
							mergeTags: e,
							char: n,
							emptyText: i,
							popoverRoot: o
						})] : []
					]
				};
			}
		});
		return (r, i) => (n(), u("div", Ee, [
			x(Te, {
				editor: f(s),
				"toolbar-position": t.toolbarPosition,
				"is-loading": f(l),
				"can-request-merge-tag": f(_),
				onOpenLinkDialog: f(v),
				onAddMergeTag: f(w)
			}, null, 8, [
				"editor",
				"toolbar-position",
				"is-loading",
				"can-request-merge-tag",
				"onOpenLinkDialog",
				"onAddMergeTag"
			]),
			x(K, {
				editor: f(s),
				"editor-content": f(c),
				"is-loading": f(l),
				"init-error": f(d),
				onRetry: f(p)
			}, null, 8, [
				"editor",
				"editor-content",
				"is-loading",
				"init-error",
				"onRetry"
			]),
			x(G, {
				visible: f(m),
				"is-editing-link": f(s)?.isActive("link") ?? !1,
				"dialog-ref": f(g),
				"onUpdate:dialogRef": i[0] ||= (t) => e(g) ? g.value = t : null,
				"link-url": f(h),
				"onUpdate:linkUrl": i[1] ||= (t) => e(h) ? h.value = t : null,
				onClose: f(S),
				onInsert: f(y),
				onRemove: f(b),
				onKeydown: f(C)
			}, null, 8, [
				"visible",
				"is-editing-link",
				"dialog-ref",
				"link-url",
				"onClose",
				"onInsert",
				"onRemove",
				"onKeydown"
			])
		]));
	}
});
//#endregion
export { De as default };

//# sourceMappingURL=ParagraphEditor-BIWXLPfu.js.map