@templatical/editor 0.16.3 → 0.16.5

package/dist/cdn/chunks/CountdownToolbar-B1oniVq1.js

@@ -1,212 +0,0 @@
-import { M as e, P as t, V as n, ct as r, f as i, g as a, it as o, m as s, ot as c, p as l, u, v as d, x as f, y as p } from "./draggable-D840DIZB.js";
-import { zt as m } from "./features-Dwb5aTLg.js";
-import { f as h, t as g } from "./ColorPicker-Pi-1fR8c.js";
-import { n as _, r as v, t as y } from "./NumberWithSuffix-CkOxH3F7.js";
-//#region src/components/toolbar/CheckboxItem.vue?vue&type=script&setup=true&lang.ts
-var b = { class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]" }, x = ["checked"], S = /* @__PURE__ */ f({
-	__name: "CheckboxItem",
-	props: {
-		modelValue: { type: Boolean },
-		label: {}
-	},
-	emits: ["update:modelValue"],
-	setup(t, { emit: n }) {
-		let i = n;
-		return (n, o) => (e(), a("label", b, [l("input", {
-			type: "checkbox",
-			class: "tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]",
-			checked: t.modelValue,
-			onChange: o[0] ||= (e) => i("update:modelValue", e.target.checked)
-		}, null, 40, x), d(" " + r(t.label), 1)]));
-	}
-}), C = ["value"], w = ["value"], T = ["value"], E = { class: "tpl:grid tpl:grid-cols-2 tpl:gap-2" }, D = ["value"], O = { value: "" }, k = ["value"], A = { class: "tpl:grid tpl:grid-cols-2 tpl:gap-3" }, j = { class: "tpl:grid tpl:grid-cols-2 tpl:gap-3" }, M = { class: "tpl:grid tpl:grid-cols-2 tpl:gap-2" }, N = [
-	"value",
-	"placeholder",
-	"onInput"
-], P = ["value", "placeholder"], F = ["value"], I = /* @__PURE__ */ f({
-	__name: "CountdownToolbar",
-	props: {
-		block: {},
-		fontFamilies: {}
-	},
-	emits: ["update"],
-	setup(d, { emit: f }) {
-		let b = f, { t: x } = m(), I = [
-			"UTC",
-			"America/New_York",
-			"America/Chicago",
-			"America/Denver",
-			"America/Los_Angeles",
-			"Europe/London",
-			"Europe/Berlin",
-			"Europe/Paris",
-			"Europe/Moscow",
-			"Asia/Dubai",
-			"Asia/Kolkata",
-			"Asia/Shanghai",
-			"Asia/Tokyo",
-			"Australia/Sydney",
-			"Pacific/Auckland"
-		], L = [
-			{
-				value: ":",
-				label: ":"
-			},
-			{
-				value: "-",
-				label: "-"
-			},
-			{
-				value: " ",
-				label: "␣"
-			}
-		], R = [
-			"Days",
-			"Hours",
-			"Minutes",
-			"Seconds"
-		], z = i(() => R.map((e) => ({
-			unit: e,
-			showKey: `show${e}`,
-			labelKey: `label${e}`,
-			translationKey: e.toLowerCase()
-		})));
-		function B(e, t) {
-			b("update", { [e]: t });
-		}
-		return (i, f) => (e(), a(u, null, [
-			p(_, { label: o(x).countdown.targetDate }, {
-				default: n(() => [l("input", {
-					type: "datetime-local",
-					class: c(o(h)),
-					value: d.block.targetDate,
-					onInput: f[0] ||= (e) => B("targetDate", e.target.value)
-				}, null, 42, C)]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.timezone }, {
-				default: n(() => [l("select", {
-					class: c(o(h)),
-					value: d.block.timezone,
-					onChange: f[1] ||= (e) => B("timezone", e.target.value)
-				}, [(e(), a(u, null, t(I, (e) => l("option", {
-					key: e,
-					value: e
-				}, r(e), 9, T)), 64))], 42, w)]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.display }, {
-				default: n(() => [l("div", E, [(e(!0), a(u, null, t(z.value, (t) => (e(), s(S, {
-					key: t.unit,
-					"model-value": d.block[t.showKey],
-					label: o(x).countdown[t.translationKey],
-					"onUpdate:modelValue": (e) => B(t.showKey, e)
-				}, null, 8, [
-					"model-value",
-					"label",
-					"onUpdate:modelValue"
-				]))), 128))])]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.separator }, {
-				default: n(() => [p(v, {
-					options: L,
-					"model-value": d.block.separator,
-					"onUpdate:modelValue": f[2] ||= (e) => B("separator", e)
-				}, null, 8, ["model-value"])]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.fontFamily }, {
-				default: n(() => [l("select", {
-					class: c(o(h)),
-					value: d.block.fontFamily || "",
-					onChange: f[3] ||= (e) => B("fontFamily", e.target.value || void 0)
-				}, [l("option", O, r(o(x).countdown.inheritFont), 1), (e(!0), a(u, null, t(d.fontFamilies, (t) => (e(), a("option", {
-					key: t.value,
-					value: t.value
-				}, r(t.label), 9, k))), 128))], 42, D)]),
-				_: 1
-			}, 8, ["label"]),
-			l("div", A, [p(_, { label: o(x).countdown.digitFontSize }, {
-				default: n(() => [p(y, {
-					"model-value": d.block.digitFontSize,
-					min: 12,
-					max: 72,
-					suffix: "px",
-					"onUpdate:modelValue": f[4] ||= (e) => B("digitFontSize", e)
-				}, null, 8, ["model-value"])]),
-				_: 1
-			}, 8, ["label"]), p(_, { label: o(x).countdown.labelFontSize }, {
-				default: n(() => [p(y, {
-					"model-value": d.block.labelFontSize,
-					min: 8,
-					max: 24,
-					suffix: "px",
-					"onUpdate:modelValue": f[5] ||= (e) => B("labelFontSize", e)
-				}, null, 8, ["model-value"])]),
-				_: 1
-			}, 8, ["label"])]),
-			l("div", j, [p(_, { label: o(x).countdown.digitColor }, {
-				default: n(() => [p(g, {
-					"model-value": d.block.digitColor,
-					"onUpdate:modelValue": f[6] ||= (e) => B("digitColor", e)
-				}, null, 8, ["model-value"])]),
-				_: 1
-			}, 8, ["label"]), p(_, { label: o(x).countdown.labelColor }, {
-				default: n(() => [p(g, {
-					"model-value": d.block.labelColor,
-					"onUpdate:modelValue": f[7] ||= (e) => B("labelColor", e)
-				}, null, 8, ["model-value"])]),
-				_: 1
-			}, 8, ["label"])]),
-			p(_, { label: o(x).countdown.background }, {
-				default: n(() => [p(g, {
-					"model-value": d.block.backgroundColor,
-					"onUpdate:modelValue": f[8] ||= (e) => B("backgroundColor", e)
-				}, null, 8, ["model-value"])]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.labels }, {
-				default: n(() => [l("div", M, [(e(!0), a(u, null, t(z.value, (t) => (e(), a("input", {
-					key: t.unit,
-					type: "text",
-					class: c(o(h)),
-					value: d.block[t.labelKey],
-					placeholder: o(x).countdown[t.translationKey],
-					onInput: (e) => B(t.labelKey, e.target.value)
-				}, null, 42, N))), 128))])]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.expiry }, {
-				default: n(() => [l("input", {
-					type: "text",
-					class: c(o(h)),
-					value: d.block.expiredMessage,
-					placeholder: o(x).countdown.expiredMessagePlaceholder,
-					onInput: f[9] ||= (e) => B("expiredMessage", e.target.value)
-				}, null, 42, P)]),
-				_: 1
-			}, 8, ["label"]),
-			p(_, { label: o(x).countdown.expiredImageUrl }, {
-				default: n(() => [l("input", {
-					type: "url",
-					class: c(o(h)),
-					value: d.block.expiredImageUrl,
-					placeholder: "https://...",
-					onInput: f[10] ||= (e) => B("expiredImageUrl", e.target.value)
-				}, null, 42, F)]),
-				_: 1
-			}, 8, ["label"]),
-			p(S, {
-				"model-value": d.block.hideOnExpiry,
-				label: o(x).countdown.hideOnExpiry,
-				class: "tpl:mb-3.5",
-				"onUpdate:modelValue": f[11] ||= (e) => B("hideOnExpiry", e)
-			}, null, 8, ["model-value", "label"])
-		], 64));
-	}
-});
-//#endregion
-export { I as default };
-
-//# sourceMappingURL=CountdownToolbar-B1oniVq1.js.map

package/dist/cdn/chunks/CountdownToolbar-B1oniVq1.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CountdownToolbar-B1oniVq1.js","names":[],"sources":["../../../src/components/toolbar/CheckboxItem.vue","../../../src/components/toolbar/CheckboxItem.vue","../../../src/components/toolbar/CountdownToolbar.vue","../../../src/components/toolbar/CountdownToolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\ndefineProps<{\n  modelValue: boolean;\n  label: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n</script>\n\n<template>\n  <label\n    class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]\"\n  >\n    <input\n      type=\"checkbox\"\n      class=\"tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]\"\n      :checked=\"modelValue\"\n      @change=\"\n        emit('update:modelValue', ($event.target as HTMLInputElement).checked)\n      \"\n    />\n    {{ label }}\n  </label>\n</template>\n","<script setup lang=\"ts\">\ndefineProps<{\n  modelValue: boolean;\n  label: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: boolean): void;\n}>();\n</script>\n\n<template>\n  <label\n    class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:text-[12px] tpl:text-[var(--tpl-text)]\"\n  >\n    <input\n      type=\"checkbox\"\n      class=\"tpl:size-3.5 tpl:cursor-pointer tpl:accent-[var(--tpl-primary)]\"\n      :checked=\"modelValue\"\n      @change=\"\n        emit('update:modelValue', ($event.target as HTMLInputElement).checked)\n      \"\n    />\n    {{ label }}\n  </label>\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport SlidingPillSelect from \"../SlidingPillSelect.vue\";\nimport FieldRow from \"./FieldRow.vue\";\nimport CheckboxItem from \"./CheckboxItem.vue\";\nimport NumberWithSuffix from \"./NumberWithSuffix.vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { inputClass } from \"../../constants/styleConstants\";\nimport type { CountdownBlock } from \"@templatical/types\";\nimport { computed } from \"vue\";\n\ndefineProps<{\n  block: CountdownBlock;\n  fontFamilies: Array<{ value: string; label: string }>;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update\", updates: Partial<CountdownBlock>): void;\n}>();\n\nconst { t } = useI18n();\n\nconst TIMEZONES = [\n  \"UTC\",\n  \"America/New_York\",\n  \"America/Chicago\",\n  \"America/Denver\",\n  \"America/Los_Angeles\",\n  \"Europe/London\",\n  \"Europe/Berlin\",\n  \"Europe/Paris\",\n  \"Europe/Moscow\",\n  \"Asia/Dubai\",\n  \"Asia/Kolkata\",\n  \"Asia/Shanghai\",\n  \"Asia/Tokyo\",\n  \"Australia/Sydney\",\n  \"Pacific/Auckland\",\n];\n\nconst SEPARATORS = [\n  { value: \":\", label: \":\" },\n  { value: \"-\", label: \"-\" },\n  { value: \" \", label: \"␣\" },\n];\n\ntype UnitKey = \"Days\" | \"Hours\" | \"Minutes\" | \"Seconds\";\nconst UNITS: UnitKey[] = [\"Days\", \"Hours\", \"Minutes\", \"Seconds\"];\n\nconst unitItems = computed(() =>\n  UNITS.map((unit) => ({\n    unit,\n    showKey: `show${unit}` as const,\n    labelKey: `label${unit}` as const,\n    translationKey: unit.toLowerCase() as\n      \"days\" | \"hours\" | \"minutes\" | \"seconds\",\n  })),\n);\n\nfunction updateField(field: keyof CountdownBlock, value: unknown): void {\n  emit(\"update\", { [field]: value } as Partial<CountdownBlock>);\n}\n</script>\n\n<template>\n  <FieldRow :label=\"t.countdown.targetDate\">\n    <input\n      type=\"datetime-local\"\n      :class=\"inputClass\"\n      :value=\"block.targetDate\"\n      @input=\"\n        updateField('targetDate', ($event.target as HTMLInputElement).value)\n      \"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.timezone\">\n    <select\n      :class=\"inputClass\"\n      :value=\"block.timezone\"\n      @change=\"\n        updateField('timezone', ($event.target as HTMLSelectElement).value)\n      \"\n    >\n      <option v-for=\"tz in TIMEZONES\" :key=\"tz\" :value=\"tz\">{{ tz }}</option>\n    </select>\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.display\">\n    <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n      <CheckboxItem\n        v-for=\"item in unitItems\"\n        :key=\"item.unit\"\n        :model-value=\"block[item.showKey]\"\n        :label=\"t.countdown[item.translationKey]\"\n        @update:model-value=\"updateField(item.showKey, $event)\"\n      />\n    </div>\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.separator\">\n    <SlidingPillSelect\n      :options=\"SEPARATORS\"\n      :model-value=\"block.separator\"\n      @update:model-value=\"updateField('separator', $event)\"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.fontFamily\">\n    <select\n      :class=\"inputClass\"\n      :value=\"block.fontFamily || ''\"\n      @change=\"\n        updateField(\n          'fontFamily',\n          ($event.target as HTMLSelectElement).value || undefined,\n        )\n      \"\n    >\n      <option value=\"\">{{ t.countdown.inheritFont }}</option>\n      <option\n        v-for=\"font in fontFamilies\"\n        :key=\"font.value\"\n        :value=\"font.value\"\n      >\n        {{ font.label }}\n      </option>\n    </select>\n  </FieldRow>\n\n  <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n    <FieldRow :label=\"t.countdown.digitFontSize\">\n      <NumberWithSuffix\n        :model-value=\"block.digitFontSize\"\n        :min=\"12\"\n        :max=\"72\"\n        suffix=\"px\"\n        @update:model-value=\"updateField('digitFontSize', $event)\"\n      />\n    </FieldRow>\n    <FieldRow :label=\"t.countdown.labelFontSize\">\n      <NumberWithSuffix\n        :model-value=\"block.labelFontSize\"\n        :min=\"8\"\n        :max=\"24\"\n        suffix=\"px\"\n        @update:model-value=\"updateField('labelFontSize', $event)\"\n      />\n    </FieldRow>\n  </div>\n\n  <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n    <FieldRow :label=\"t.countdown.digitColor\">\n      <ColorPicker\n        :model-value=\"block.digitColor\"\n        @update:model-value=\"updateField('digitColor', $event)\"\n      />\n    </FieldRow>\n    <FieldRow :label=\"t.countdown.labelColor\">\n      <ColorPicker\n        :model-value=\"block.labelColor\"\n        @update:model-value=\"updateField('labelColor', $event)\"\n      />\n    </FieldRow>\n  </div>\n\n  <FieldRow :label=\"t.countdown.background\">\n    <ColorPicker\n      :model-value=\"block.backgroundColor\"\n      @update:model-value=\"updateField('backgroundColor', $event)\"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.labels\">\n    <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n      <input\n        v-for=\"item in unitItems\"\n        :key=\"item.unit\"\n        type=\"text\"\n        :class=\"inputClass\"\n        :value=\"block[item.labelKey]\"\n        :placeholder=\"t.countdown[item.translationKey]\"\n        @input=\"\n          updateField(item.labelKey, ($event.target as HTMLInputElement).value)\n        \"\n      />\n    </div>\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.expiry\">\n    <input\n      type=\"text\"\n      :class=\"inputClass\"\n      :value=\"block.expiredMessage\"\n      :placeholder=\"t.countdown.expiredMessagePlaceholder\"\n      @input=\"\n        updateField('expiredMessage', ($event.target as HTMLInputElement).value)\n      \"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.expiredImageUrl\">\n    <input\n      type=\"url\"\n      :class=\"inputClass\"\n      :value=\"block.expiredImageUrl\"\n      placeholder=\"https://...\"\n      @input=\"\n        updateField(\n          'expiredImageUrl',\n          ($event.target as HTMLInputElement).value,\n        )\n      \"\n    />\n  </FieldRow>\n\n  <CheckboxItem\n    :model-value=\"block.hideOnExpiry\"\n    :label=\"t.countdown.hideOnExpiry\"\n    class=\"tpl:mb-3.5\"\n    @update:model-value=\"updateField('hideOnExpiry', $event)\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport SlidingPillSelect from \"../SlidingPillSelect.vue\";\nimport FieldRow from \"./FieldRow.vue\";\nimport CheckboxItem from \"./CheckboxItem.vue\";\nimport NumberWithSuffix from \"./NumberWithSuffix.vue\";\nimport { useI18n } from \"../../composables/useI18n\";\nimport { inputClass } from \"../../constants/styleConstants\";\nimport type { CountdownBlock } from \"@templatical/types\";\nimport { computed } from \"vue\";\n\ndefineProps<{\n  block: CountdownBlock;\n  fontFamilies: Array<{ value: string; label: string }>;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update\", updates: Partial<CountdownBlock>): void;\n}>();\n\nconst { t } = useI18n();\n\nconst TIMEZONES = [\n  \"UTC\",\n  \"America/New_York\",\n  \"America/Chicago\",\n  \"America/Denver\",\n  \"America/Los_Angeles\",\n  \"Europe/London\",\n  \"Europe/Berlin\",\n  \"Europe/Paris\",\n  \"Europe/Moscow\",\n  \"Asia/Dubai\",\n  \"Asia/Kolkata\",\n  \"Asia/Shanghai\",\n  \"Asia/Tokyo\",\n  \"Australia/Sydney\",\n  \"Pacific/Auckland\",\n];\n\nconst SEPARATORS = [\n  { value: \":\", label: \":\" },\n  { value: \"-\", label: \"-\" },\n  { value: \" \", label: \"␣\" },\n];\n\ntype UnitKey = \"Days\" | \"Hours\" | \"Minutes\" | \"Seconds\";\nconst UNITS: UnitKey[] = [\"Days\", \"Hours\", \"Minutes\", \"Seconds\"];\n\nconst unitItems = computed(() =>\n  UNITS.map((unit) => ({\n    unit,\n    showKey: `show${unit}` as const,\n    labelKey: `label${unit}` as const,\n    translationKey: unit.toLowerCase() as\n      \"days\" | \"hours\" | \"minutes\" | \"seconds\",\n  })),\n);\n\nfunction updateField(field: keyof CountdownBlock, value: unknown): void {\n  emit(\"update\", { [field]: value } as Partial<CountdownBlock>);\n}\n</script>\n\n<template>\n  <FieldRow :label=\"t.countdown.targetDate\">\n    <input\n      type=\"datetime-local\"\n      :class=\"inputClass\"\n      :value=\"block.targetDate\"\n      @input=\"\n        updateField('targetDate', ($event.target as HTMLInputElement).value)\n      \"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.timezone\">\n    <select\n      :class=\"inputClass\"\n      :value=\"block.timezone\"\n      @change=\"\n        updateField('timezone', ($event.target as HTMLSelectElement).value)\n      \"\n    >\n      <option v-for=\"tz in TIMEZONES\" :key=\"tz\" :value=\"tz\">{{ tz }}</option>\n    </select>\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.display\">\n    <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n      <CheckboxItem\n        v-for=\"item in unitItems\"\n        :key=\"item.unit\"\n        :model-value=\"block[item.showKey]\"\n        :label=\"t.countdown[item.translationKey]\"\n        @update:model-value=\"updateField(item.showKey, $event)\"\n      />\n    </div>\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.separator\">\n    <SlidingPillSelect\n      :options=\"SEPARATORS\"\n      :model-value=\"block.separator\"\n      @update:model-value=\"updateField('separator', $event)\"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.fontFamily\">\n    <select\n      :class=\"inputClass\"\n      :value=\"block.fontFamily || ''\"\n      @change=\"\n        updateField(\n          'fontFamily',\n          ($event.target as HTMLSelectElement).value || undefined,\n        )\n      \"\n    >\n      <option value=\"\">{{ t.countdown.inheritFont }}</option>\n      <option\n        v-for=\"font in fontFamilies\"\n        :key=\"font.value\"\n        :value=\"font.value\"\n      >\n        {{ font.label }}\n      </option>\n    </select>\n  </FieldRow>\n\n  <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n    <FieldRow :label=\"t.countdown.digitFontSize\">\n      <NumberWithSuffix\n        :model-value=\"block.digitFontSize\"\n        :min=\"12\"\n        :max=\"72\"\n        suffix=\"px\"\n        @update:model-value=\"updateField('digitFontSize', $event)\"\n      />\n    </FieldRow>\n    <FieldRow :label=\"t.countdown.labelFontSize\">\n      <NumberWithSuffix\n        :model-value=\"block.labelFontSize\"\n        :min=\"8\"\n        :max=\"24\"\n        suffix=\"px\"\n        @update:model-value=\"updateField('labelFontSize', $event)\"\n      />\n    </FieldRow>\n  </div>\n\n  <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-3\">\n    <FieldRow :label=\"t.countdown.digitColor\">\n      <ColorPicker\n        :model-value=\"block.digitColor\"\n        @update:model-value=\"updateField('digitColor', $event)\"\n      />\n    </FieldRow>\n    <FieldRow :label=\"t.countdown.labelColor\">\n      <ColorPicker\n        :model-value=\"block.labelColor\"\n        @update:model-value=\"updateField('labelColor', $event)\"\n      />\n    </FieldRow>\n  </div>\n\n  <FieldRow :label=\"t.countdown.background\">\n    <ColorPicker\n      :model-value=\"block.backgroundColor\"\n      @update:model-value=\"updateField('backgroundColor', $event)\"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.labels\">\n    <div class=\"tpl:grid tpl:grid-cols-2 tpl:gap-2\">\n      <input\n        v-for=\"item in unitItems\"\n        :key=\"item.unit\"\n        type=\"text\"\n        :class=\"inputClass\"\n        :value=\"block[item.labelKey]\"\n        :placeholder=\"t.countdown[item.translationKey]\"\n        @input=\"\n          updateField(item.labelKey, ($event.target as HTMLInputElement).value)\n        \"\n      />\n    </div>\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.expiry\">\n    <input\n      type=\"text\"\n      :class=\"inputClass\"\n      :value=\"block.expiredMessage\"\n      :placeholder=\"t.countdown.expiredMessagePlaceholder\"\n      @input=\"\n        updateField('expiredMessage', ($event.target as HTMLInputElement).value)\n      \"\n    />\n  </FieldRow>\n\n  <FieldRow :label=\"t.countdown.expiredImageUrl\">\n    <input\n      type=\"url\"\n      :class=\"inputClass\"\n      :value=\"block.expiredImageUrl\"\n      placeholder=\"https://...\"\n      @input=\"\n        updateField(\n          'expiredImageUrl',\n          ($event.target as HTMLInputElement).value,\n        )\n      \"\n    />\n  </FieldRow>\n\n  <CheckboxItem\n    :model-value=\"block.hideOnExpiry\"\n    :label=\"t.countdown.hideOnExpiry\"\n    class=\"tpl:mb-3.5\"\n    @update:model-value=\"updateField('hideOnExpiry', $event)\"\n  />\n</template>\n"],"mappings":"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"}

package/dist/cdn/chunks/MergeTagSuggestion-jesxS7An.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MergeTagSuggestion-jesxS7An.js","names":["$emit"],"sources":["../../../src/components/MergeTagSuggestionList.vue","../../../src/components/MergeTagSuggestionList.vue","../../../src/extensions/MergeTagSuggestion.ts"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { MergeTag } from \"@templatical/types\";\n\nconst props = defineProps<{\n  items: MergeTag[];\n  selectedIndex: number;\n  emptyText: string;\n  /** Stable id used for aria-controls + per-option id derivation. */\n  listId?: string;\n}>();\n\ndefineEmits<{\n  (e: \"select\", item: MergeTag): void;\n  (e: \"hover\", index: number): void;\n}>();\n\nfunction optionId(index: number): string | undefined {\n  return props.listId ? `${props.listId}-opt-${index}` : undefined;\n}\n</script>\n\n<template>\n  <div\n    :id=\"listId\"\n    class=\"tpl:min-w-[200px] tpl:max-w-[320px] tpl:max-h-[50vh] tpl:overflow-y-auto tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:py-1 tpl:shadow-lg\"\n    role=\"listbox\"\n    data-testid=\"merge-tag-suggestion-list\"\n  >\n    <div\n      v-if=\"items.length === 0\"\n      class=\"tpl:px-3 tpl:py-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n      data-testid=\"merge-tag-suggestion-empty\"\n    >\n      {{ emptyText }}\n    </div>\n    <button\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      :id=\"optionId(index)\"\n      type=\"button\"\n      role=\"option\"\n      :aria-selected=\"index === selectedIndex\"\n      :data-selected=\"index === selectedIndex ? 'true' : 'false'\"\n      :data-merge-tag-value=\"item.value\"\n      class=\"tpl:flex tpl:w-full tpl:flex-col tpl:items-start tpl:gap-0.5 tpl:px-3 tpl:py-1.5 tpl:text-left tpl:text-xs tpl:transition-colors\"\n      :class=\"\n        index === selectedIndex\n          ? 'tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary)]'\n          : 'tpl:text-[var(--tpl-text)] hover:tpl:bg-[var(--tpl-bg-hover)]'\n      \"\n      @mousedown.prevent.stop=\"$emit('select', item)\"\n      @mousemove=\"index !== selectedIndex && $emit('hover', index)\"\n    >\n      <span class=\"tpl:font-medium\">{{ item.label }}</span>\n      <span class=\"tpl:text-[var(--tpl-text-dim)] tpl:font-mono\">{{\n        item.value\n      }}</span>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport type { MergeTag } from \"@templatical/types\";\n\nconst props = defineProps<{\n  items: MergeTag[];\n  selectedIndex: number;\n  emptyText: string;\n  /** Stable id used for aria-controls + per-option id derivation. */\n  listId?: string;\n}>();\n\ndefineEmits<{\n  (e: \"select\", item: MergeTag): void;\n  (e: \"hover\", index: number): void;\n}>();\n\nfunction optionId(index: number): string | undefined {\n  return props.listId ? `${props.listId}-opt-${index}` : undefined;\n}\n</script>\n\n<template>\n  <div\n    :id=\"listId\"\n    class=\"tpl:min-w-[200px] tpl:max-w-[320px] tpl:max-h-[50vh] tpl:overflow-y-auto tpl:rounded-[var(--tpl-radius)] tpl:border tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)] tpl:py-1 tpl:shadow-lg\"\n    role=\"listbox\"\n    data-testid=\"merge-tag-suggestion-list\"\n  >\n    <div\n      v-if=\"items.length === 0\"\n      class=\"tpl:px-3 tpl:py-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n      data-testid=\"merge-tag-suggestion-empty\"\n    >\n      {{ emptyText }}\n    </div>\n    <button\n      v-for=\"(item, index) in items\"\n      :key=\"item.value\"\n      :id=\"optionId(index)\"\n      type=\"button\"\n      role=\"option\"\n      :aria-selected=\"index === selectedIndex\"\n      :data-selected=\"index === selectedIndex ? 'true' : 'false'\"\n      :data-merge-tag-value=\"item.value\"\n      class=\"tpl:flex tpl:w-full tpl:flex-col tpl:items-start tpl:gap-0.5 tpl:px-3 tpl:py-1.5 tpl:text-left tpl:text-xs tpl:transition-colors\"\n      :class=\"\n        index === selectedIndex\n          ? 'tpl:bg-[var(--tpl-primary-light)] tpl:text-[var(--tpl-primary)]'\n          : 'tpl:text-[var(--tpl-text)] hover:tpl:bg-[var(--tpl-bg-hover)]'\n      \"\n      @mousedown.prevent.stop=\"$emit('select', item)\"\n      @mousemove=\"index !== selectedIndex && $emit('hover', index)\"\n    >\n      <span class=\"tpl:font-medium\">{{ item.label }}</span>\n      <span class=\"tpl:text-[var(--tpl-text-dim)] tpl:font-mono\">{{\n        item.value\n      }}</span>\n    </button>\n  </div>\n</template>\n","import type { MergeTag } from \"@templatical/types\";\nimport { Extension } from \"@tiptap/core\";\nimport Suggestion, {\n  type SuggestionOptions,\n  type SuggestionProps,\n  type SuggestionKeyDownProps,\n} from \"@tiptap/suggestion\";\nimport { type App, createApp, h, ref, type Ref } from \"vue\";\nimport MergeTagSuggestionList from \"../components/MergeTagSuggestionList.vue\";\n\nconst MAX_RESULTS = 10;\n\n// Monotonic counter for unique listbox IDs across multiple popup instances.\nlet POPUP_ID_SEQ = 0;\n\nexport interface MergeTagSuggestionOptions {\n  /** Available merge tags */\n  mergeTags: MergeTag[];\n  /** Trigger string (e.g. \"{{\", \"*|\", \"%%=\") */\n  char: string;\n  /** Localized empty-state label */\n  emptyText: string;\n  /**\n   * Mount target for the suggestion popup. When provided with a non-null\n   * `.value`, the popup attaches into that element instead of\n   * `document.body` — keeping it inside the editor's effective DOM root\n   * (shadow-aware). Pass the ref returned by `usePopoverRoot()`.\n   *\n   * Falls back to `document.body` when omitted or when the ref's value is\n   * null at popup-open time (e.g. headless/test editors without an editor\n   * shell). Preserves pre-Phase-3 behavior for callers that don't migrate.\n   */\n  popoverRoot?: Ref<HTMLElement | null> | null;\n}\n\n/**\n * Filter merge tags by query against label and value (case-insensitive).\n * Capped at MAX_RESULTS. Exported for testing.\n */\nexport function filterMergeTags(tags: MergeTag[], query: string): MergeTag[] {\n  const trimmed = query.trim().toLowerCase();\n  if (trimmed === \"\") {\n    return tags.slice(0, MAX_RESULTS);\n  }\n  return tags\n    .filter((tag) => {\n      const label = tag.label.toLowerCase();\n      const value = tag.value.toLowerCase();\n      return label.includes(trimmed) || value.includes(trimmed);\n    })\n    .slice(0, MAX_RESULTS);\n}\n\n/**\n * Handle a keydown event against a list of items. Returns whether the\n * event was handled (so the suggestion plugin can stop propagation).\n * Exported for testing.\n */\nexport function handleSuggestionKeyDown(\n  event: KeyboardEvent,\n  items: MergeTag[],\n  selectedIndex: Ref<number>,\n  onSelect: (item: MergeTag) => void,\n): boolean {\n  if (items.length === 0) {\n    if (event.key === \"Enter\" || event.key === \"Tab\") return true;\n    return false;\n  }\n\n  if (event.key === \"ArrowDown\") {\n    selectedIndex.value = (selectedIndex.value + 1) % items.length;\n    return true;\n  }\n  if (event.key === \"ArrowUp\") {\n    selectedIndex.value =\n      (selectedIndex.value - 1 + items.length) % items.length;\n    return true;\n  }\n  if (event.key === \"Enter\" || event.key === \"Tab\") {\n    onSelect(items[selectedIndex.value]);\n    return true;\n  }\n  return false;\n}\n\n/** Options for opening the merge-tag popup. */\nexport interface MergeTagPopupOpenOptions {\n  /** Filtered tags to render. */\n  items: MergeTag[];\n  /**\n   * Anchor rect getter (the caret rect). Same contract as\n   * `@tiptap/suggestion`'s `clientRect`: viewport coordinates, re-read on\n   * every reposition so the popup tracks the caret through scroll.\n   */\n  getRect: (() => DOMRect | null) | null;\n  /**\n   * Element that owns the ARIA combobox state and serves as the theme +\n   * scroll-ancestor anchor — the ProseMirror `view.dom` in rich text, the\n   * `<input>`/`<textarea>` in a field.\n   */\n  anchorEl: HTMLElement | null;\n  /** Called with the item the user picks. */\n  onCommand: (item: MergeTag) => void;\n}\n\n/** Options for updating the popup after the query changed. */\nexport interface MergeTagPopupUpdateOptions {\n  items: MergeTag[];\n  getRect: (() => DOMRect | null) | null;\n  onCommand: (item: MergeTag) => void;\n}\n\n/**\n * Imperative handle over a single merge-tag suggestion popup.\n * Both the TipTap suggestion renderer and the input/textarea autocomplete\n * driver drive the SAME controller, so the popup's rendering, positioning,\n * scroll-tracking, ARIA wiring, and keyboard behavior are identical across\n * rich-text and plain-field surfaces by construction.\n */\nexport interface MergeTagPopupController {\n  /** Mount the popup and start tracking the caret. */\n  open(options: MergeTagPopupOpenOptions): void;\n  /** Refresh items + anchor after the query changed. */\n  update(options: MergeTagPopupUpdateOptions): void;\n  /**\n   * Handle a navigation/selection key (Arrow/Enter/Tab). Returns whether it\n   * was handled. Does NOT handle Escape — each caller owns Escape (TipTap's\n   * plugin closes via `onExit`; the field driver calls `close()`).\n   */\n  handleKeyDown(event: KeyboardEvent): boolean;\n  /** Unmount the popup, clear ARIA, and detach listeners. Idempotent. */\n  close(): void;\n  /** Whether the popup is currently mounted. */\n  isOpen(): boolean;\n}\n\n/**\n * Creates a merge-tag suggestion popup controller: mount, ARIA wiring,\n * caret-tracking position (flip-above + off-screen freeze), scroll/resize\n * repositioning, and cleanup. Framework-agnostic — it takes a plain caret\n * rect getter and an anchor element, so it serves both the ProseMirror\n * suggestion plugin and native text fields.\n */\nexport function createMergeTagPopup(\n  emptyText: string,\n  popoverRootRef?: Ref<HTMLElement | null> | null,\n): MergeTagPopupController {\n  let app: App | null = null;\n  let container: HTMLElement | null = null;\n  let editableEl: HTMLElement | null = null;\n  const itemsRef = ref<MergeTag[]>([]);\n  const selectedIndex = ref(0);\n  let currentCommand: ((item: MergeTag) => void) | null = null;\n  const listId = `tpl-merge-tag-suggestion-${++POPUP_ID_SEQ}`;\n  let latestClientRect: (() => DOMRect | null) | null = null;\n  let scrollTargets: Array<EventTarget> = [];\n  let pendingRaf: number | null = null;\n\n  function reposition(): void {\n    position(latestClientRect?.() ?? null);\n  }\n\n  /**\n   * Reposition immediately and on the next animation frame.\n   * After a keystroke triggers the suggestion, TipTap may run its\n   * own `scrollIntoView` to keep the caret visible. That scroll\n   * lands AFTER the current task's `position()` call but BEFORE\n   * the browser's next paint, so we re-measure on rAF to catch\n   * the post-scroll caret rect. Without this, the popup pins to\n   * the pre-scroll caret position and ends up offset on slower\n   * runners.\n   */\n  function repositionAfterPaint(): void {\n    reposition();\n    if (pendingRaf !== null) cancelAnimationFrame(pendingRaf);\n    pendingRaf = requestAnimationFrame(() => {\n      pendingRaf = null;\n      reposition();\n    });\n  }\n\n  function collectScrollAncestors(el: HTMLElement | null): HTMLElement[] {\n    // Walk up the DOM finding scrollable ancestors. ProseMirror's\n    // scrollIntoView fires on whichever ancestor scrolls — listening\n    // to all of them ensures we reposition regardless of which one\n    // moves.\n    const result: HTMLElement[] = [];\n    let node: HTMLElement | null = el?.parentElement ?? null;\n    while (\n      node &&\n      // shadow-ok: ancestor walk terminator; not a mount target\n      node !== document.body &&\n      node !== document.documentElement\n    ) {\n      const style = window.getComputedStyle(node);\n      const overflow = style.overflow + style.overflowX + style.overflowY;\n      if (/(auto|scroll|overlay)/.test(overflow)) {\n        result.push(node);\n      }\n      node = node.parentElement;\n    }\n    return result;\n  }\n\n  function attachScrollListeners(viewDom: HTMLElement | null): void {\n    scrollTargets = [window, ...collectScrollAncestors(viewDom)];\n    for (const target of scrollTargets) {\n      target.addEventListener(\"scroll\", reposition, {\n        passive: true,\n        capture: true,\n      });\n    }\n    window.addEventListener(\"resize\", reposition, { passive: true });\n  }\n\n  function detachScrollListeners(): void {\n    for (const target of scrollTargets) {\n      target.removeEventListener(\"scroll\", reposition, {\n        capture: true,\n      } as EventListenerOptions);\n    }\n    window.removeEventListener(\"resize\", reposition);\n    scrollTargets = [];\n  }\n\n  function position(rect: DOMRect | null): void {\n    if (!container || !rect) return;\n    // If the caret has scrolled out of the viewport, freeze the\n    // popup at its last on-screen position. Following the caret\n    // off-screen produces an invisible popup the user can't reach,\n    // and lets pathological scroll loops drag the popup further\n    // each tick.\n    if (rect.bottom < 0 || rect.top > window.innerHeight) return;\n    container.style.position = \"fixed\";\n    container.style.left = `${rect.left}px`;\n    container.style.zIndex = \"9999\";\n    // Place below caret first; offsetHeight is sync-readable after\n    // the Vue app has mounted (or after onUpdate's reactive flush).\n    container.style.top = `${rect.bottom}px`;\n    const popupHeight = container.offsetHeight;\n    if (popupHeight === 0) return;\n    const spaceBelow = window.innerHeight - rect.bottom;\n    if (spaceBelow < popupHeight) {\n      // Not enough room below — flip above. Clamp to 0 so the\n      // popup never positions off the top of the viewport.\n      const flippedTop = Math.max(0, rect.top - popupHeight);\n      container.style.top = `${flippedTop}px`;\n    }\n  }\n\n  function applyThemeContext(\n    target: HTMLElement,\n    editorEl: HTMLElement | null | undefined,\n  ): void {\n    // When the popup mounts to document.body its `position: fixed`\n    // resolves against the viewport — any transform/filter on a\n    // consumer-page ancestor (route transitions, reveal animations,\n    // dark canvas inversion) creates a containing block and moves\n    // fixed descendants with it. Body ancestors don't transform.\n    //\n    // When mounting inside the editor's popover root, the popup is a\n    // descendant of the `.tpl[data-tpl-theme]` root so CSS vars + font\n    // would inherit — but the snapshot below is still emitted inline\n    // because inline declarations win and the cost is negligible. This\n    // keeps a single behavior across both mount paths.\n    //\n    // CSS vars (--tpl-bg-elevated, --tpl-border, etc.) are scoped to\n    // `.tpl` and `.tpl[data-tpl-theme=\"dark\"]` in the editor's\n    // stylesheet, so the popup wouldn't inherit them at body root.\n    // Adding `class=\"tpl\"` would also pull base rules (min-height,\n    // flex, full-page bg) we don't want on a popup. Instead, snapshot\n    // every --tpl-* custom property from the editor's theme root and\n    // re-emit them inline on the popup wrapper.\n    const themeRoot = editorEl?.closest<HTMLElement>(\"[data-tpl-theme]\");\n    if (!themeRoot) return;\n    const themeValue = themeRoot.getAttribute(\"data-tpl-theme\");\n    if (themeValue) target.setAttribute(\"data-tpl-theme\", themeValue);\n    const computed = window.getComputedStyle(themeRoot);\n    for (let i = 0; i < computed.length; i++) {\n      const prop = computed[i];\n      if (prop.startsWith(\"--tpl-\")) {\n        target.style.setProperty(prop, computed.getPropertyValue(prop));\n      }\n    }\n    // The popup no longer inherits font from the editor wrapper, so\n    // its content would render in the page's default font and end up\n    // at a different height — which changes the flip-above decision\n    // and shifts the popup off the caret. Copy typography too.\n    target.style.fontFamily = computed.fontFamily;\n    target.style.fontSize = computed.fontSize;\n    target.style.lineHeight = computed.lineHeight;\n  }\n\n  function setEditableAria(active: boolean): void {\n    if (!editableEl) return;\n    if (active) {\n      editableEl.setAttribute(\"role\", \"combobox\");\n      editableEl.setAttribute(\"aria-haspopup\", \"listbox\");\n      editableEl.setAttribute(\"aria-expanded\", \"true\");\n      editableEl.setAttribute(\"aria-controls\", listId);\n    } else {\n      editableEl.removeAttribute(\"aria-expanded\");\n      editableEl.removeAttribute(\"aria-controls\");\n      editableEl.removeAttribute(\"aria-activedescendant\");\n      editableEl.removeAttribute(\"aria-haspopup\");\n      editableEl.removeAttribute(\"role\");\n    }\n  }\n\n  function setActiveDescendant(): void {\n    if (!editableEl) return;\n    if (itemsRef.value.length === 0) {\n      editableEl.removeAttribute(\"aria-activedescendant\");\n      return;\n    }\n    editableEl.setAttribute(\n      \"aria-activedescendant\",\n      `${listId}-opt-${selectedIndex.value}`,\n    );\n  }\n\n  function select(item: MergeTag): void {\n    currentCommand?.(item);\n  }\n\n  return {\n    open: ({ items, getRect, anchorEl, onCommand }) => {\n      itemsRef.value = items;\n      selectedIndex.value = 0;\n      currentCommand = onCommand;\n\n      container = document.createElement(\"div\");\n      container.setAttribute(\"data-testid\", \"merge-tag-suggestion-popup\");\n      editableEl = anchorEl;\n      applyThemeContext(container, anchorEl);\n      // Prefer the editor's popover root (shadow-aware) when wired by\n      // the consumer. Falls back to document.body for headless callers\n      // that don't pass `popoverRoot` to configure().\n      // shadow-ok: fallback when popoverRoot wasn't provided (e.g., headless caller); editor mounts pass the shadow-aware root\n      const mountTarget = popoverRootRef?.value ?? document.body;\n      mountTarget.appendChild(container);\n\n      app = createApp({\n        render() {\n          return h(MergeTagSuggestionList, {\n            items: itemsRef.value,\n            selectedIndex: selectedIndex.value,\n            emptyText,\n            listId,\n            onSelect: (item: MergeTag) => select(item),\n            onHover: (index: number) => {\n              selectedIndex.value = index;\n              setActiveDescendant();\n            },\n          });\n        },\n      });\n      app.mount(container);\n      setEditableAria(true);\n      setActiveDescendant();\n      latestClientRect = getRect;\n      repositionAfterPaint();\n      attachScrollListeners(anchorEl);\n    },\n    update: ({ items, getRect, onCommand }) => {\n      itemsRef.value = items;\n      // Reset selection when item set changes (query changed).\n      if (selectedIndex.value >= items.length) {\n        selectedIndex.value = 0;\n      }\n      currentCommand = onCommand;\n      setActiveDescendant();\n      latestClientRect = getRect;\n      repositionAfterPaint();\n    },\n    handleKeyDown: (event: KeyboardEvent): boolean => {\n      const handled = handleSuggestionKeyDown(\n        event,\n        itemsRef.value,\n        selectedIndex,\n        select,\n      );\n      if (handled) setActiveDescendant();\n      return handled;\n    },\n    close: () => {\n      // Idempotent: nothing to tear down (and no window listeners to detach)\n      // when the popup was never opened. Keeps repeated close() / close-before-\n      // open cheap and side-effect-free.\n      if (container === null) return;\n      if (pendingRaf !== null) {\n        cancelAnimationFrame(pendingRaf);\n        pendingRaf = null;\n      }\n      detachScrollListeners();\n      setEditableAria(false);\n      app?.unmount();\n      container.remove();\n      app = null;\n      container = null;\n      editableEl = null;\n      currentCommand = null;\n      latestClientRect = null;\n    },\n    isOpen: () => container !== null,\n  };\n}\n\n/**\n * Builds the `@tiptap/suggestion` `render` factory for the merge-tag popup.\n * A thin adapter over {@link createMergeTagPopup}: it maps ProseMirror's\n * `SuggestionProps` (items, `clientRect`, `view.dom`, `command`) onto the\n * controller. Exported as a standalone function so that mapping can be\n * unit-tested with mocked `SuggestionProps` instead of a full editor.\n */\nexport function createMergeTagSuggestionRenderer(\n  emptyText: string,\n  popoverRootRef?: Ref<HTMLElement | null> | null,\n): NonNullable<SuggestionOptions<MergeTag>[\"render\"]> {\n  return () => {\n    const popup = createMergeTagPopup(emptyText, popoverRootRef);\n\n    return {\n      onStart: (props: SuggestionProps<MergeTag>) => {\n        // Use view.dom (ProseMirror contenteditable, actually\n        // attached to the DOM) rather than options.element, which may\n        // be a detached div when no `element` is passed to the editor\n        // constructor (as is the case with @tiptap/vue-3 EditorContent).\n        const viewDom = props.editor.view?.dom as HTMLElement | undefined;\n        popup.open({\n          items: props.items,\n          getRect: props.clientRect ?? null,\n          anchorEl: viewDom ?? null,\n          onCommand: (item) => props.command(item),\n        });\n      },\n      onUpdate: (props: SuggestionProps<MergeTag>) => {\n        popup.update({\n          items: props.items,\n          getRect: props.clientRect ?? null,\n          onCommand: (item) => props.command(item),\n        });\n      },\n      onKeyDown: (props: SuggestionKeyDownProps): boolean => {\n        // Escape closes via TipTap's suggestion plugin (→ onExit); report it\n        // handled without selecting.\n        if (props.event.key === \"Escape\") {\n          return true;\n        }\n        return popup.handleKeyDown(props.event);\n      },\n      onExit: () => popup.close(),\n    };\n  };\n}\n\nexport const MergeTagSuggestion = Extension.create<MergeTagSuggestionOptions>({\n  name: \"mergeTagSuggestion\",\n\n  addOptions() {\n    return {\n      mergeTags: [],\n      char: \"{{\",\n      emptyText: \"No matching merge tags\",\n      popoverRoot: null,\n    };\n  },\n\n  addProseMirrorPlugins() {\n    const tags = this.options.mergeTags;\n    const emptyText = this.options.emptyText;\n    const popoverRootRef = this.options.popoverRoot;\n\n    const config: Omit<SuggestionOptions<MergeTag>, \"editor\"> = {\n      char: this.options.char,\n      allowSpaces: false,\n      startOfLine: false,\n      // Default is [\" \"] which requires whitespace/line-start before the\n      // trigger char — so `.{{` would not fire. Allow any preceding char.\n      allowedPrefixes: null,\n      items: ({ query }: { query: string }) => filterMergeTags(tags, query),\n      command: ({\n        editor,\n        range,\n        props,\n      }: {\n        editor: SuggestionProps<MergeTag>[\"editor\"];\n        range: { from: number; to: number };\n        props: MergeTag;\n      }) => {\n        // Use insertContentAt for atomic replace (matches the canonical\n        // @tiptap/suggestion + Mention pattern). Avoids edge cases where\n        // chained deleteRange + insertMergeTag fails to insert when the\n        // selection state shifts mid-chain.\n        editor\n          .chain()\n          .focus()\n          .insertContentAt(range, {\n            type: \"mergeTagNode\",\n            attrs: { label: props.label, value: props.value },\n          })\n          .run();\n      },\n      render: createMergeTagSuggestionRenderer(emptyText, popoverRootRef),\n    };\n\n    return [\n      Suggestion({\n        editor: this.editor,\n        ...config,\n      }),\n    ];\n  },\n});\n"],"mappings":"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"}

package/dist/cdn/chunks/ParagraphEditor-4cMKKC-V.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ParagraphEditor-4cMKKC-V.js","names":[],"sources":["../../../src/components/blocks/EmojiPickerDropdown.vue","../../../src/components/blocks/EmojiPickerDropdown.vue","../../../src/components/toolbar/ToolbarIconButton.vue","../../../src/components/toolbar/ToolbarIconButton.vue","../../../src/components/toolbar/ToolbarSeparator.vue","../../../src/components/toolbar/ToolbarSelect.vue","../../../src/components/toolbar/ToolbarSelect.vue","../../../src/utils/richTextColor.ts","../../../src/components/blocks/ParagraphToolbar.vue","../../../src/components/blocks/ParagraphToolbar.vue","../../../src/components/blocks/ParagraphEditor.vue","../../../src/components/blocks/ParagraphEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useEmoji, useI18n } from \"../../composables\";\nimport { useFocusTrap } from \"../../composables/useFocusTrap\";\nimport { onClickOutside } from \"@vueuse/core\";\nimport { Smile } from \"@lucide/vue\";\nimport { computed, ref } from \"vue\";\n\nconst emit = defineEmits<{\n  (e: \"insert\", emoji: string): void;\n}>();\n\nconst {\n  categories: emojiCategories,\n  isOpen: showEmojiPicker,\n  toggle: toggleEmojiPicker,\n  close: closeEmojiPicker,\n} = useEmoji();\n\nconst { t, format } = useI18n();\n\nconst pickerRef = ref<HTMLElement | null>(null);\nconst rootRef = ref<HTMLElement | null>(null);\n\nconst isOpenRef = computed(() => showEmojiPicker.value);\nuseFocusTrap(pickerRef, isOpenRef);\n\nonClickOutside(rootRef, () => {\n  if (showEmojiPicker.value) {\n    closeEmojiPicker();\n  }\n});\n\nfunction handleInsert(emoji: string): void {\n  emit(\"insert\", emoji);\n  closeEmojiPicker();\n}\n</script>\n\n<template>\n  <div ref=\"rootRef\" class=\"tpl:relative\">\n    <button\n      type=\"button\"\n      class=\"tpl-text-toolbar-btn\"\n      :class=\"{\n        'tpl-text-toolbar-btn--active': showEmojiPicker,\n      }\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      :title=\"t.paragraphEditor.insertEmoji\"\n      :aria-expanded=\"showEmojiPicker\"\n      aria-haspopup=\"dialog\"\n      aria-controls=\"tpl-emoji-picker\"\n      @click=\"toggleEmojiPicker\"\n    >\n      <Smile :size=\"16\" :stroke-width=\"2\" />\n    </button>\n    <div\n      v-if=\"showEmojiPicker\"\n      id=\"tpl-emoji-picker\"\n      ref=\"pickerRef\"\n      role=\"dialog\"\n      aria-modal=\"false\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      tabindex=\"-1\"\n      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\"\n      @keydown.esc.stop.prevent=\"closeEmojiPicker\"\n    >\n      <div\n        v-for=\"category in emojiCategories\"\n        :key=\"category.key\"\n        class=\"tpl:mb-2 tpl:last:mb-0\"\n      >\n        <div\n          class=\"tpl:mb-1.5 tpl:text-[10px] tpl:font-medium tpl:tracking-wide tpl:text-[var(--tpl-text-muted)] tpl:uppercase\"\n        >\n          {{ t.emoji[category.key] }}\n        </div>\n        <div class=\"tpl:grid tpl:grid-cols-10 tpl:gap-0.5\">\n          <button\n            v-for=\"emoji in category.emojis\"\n            :key=\"emoji\"\n            type=\"button\"\n            :aria-label=\"format(t.paragraphEditor.emojiItemLabel, { emoji })\"\n            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)]\"\n            @click=\"handleInsert(emoji)\"\n          >\n            {{ emoji }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { useEmoji, useI18n } from \"../../composables\";\nimport { useFocusTrap } from \"../../composables/useFocusTrap\";\nimport { onClickOutside } from \"@vueuse/core\";\nimport { Smile } from \"@lucide/vue\";\nimport { computed, ref } from \"vue\";\n\nconst emit = defineEmits<{\n  (e: \"insert\", emoji: string): void;\n}>();\n\nconst {\n  categories: emojiCategories,\n  isOpen: showEmojiPicker,\n  toggle: toggleEmojiPicker,\n  close: closeEmojiPicker,\n} = useEmoji();\n\nconst { t, format } = useI18n();\n\nconst pickerRef = ref<HTMLElement | null>(null);\nconst rootRef = ref<HTMLElement | null>(null);\n\nconst isOpenRef = computed(() => showEmojiPicker.value);\nuseFocusTrap(pickerRef, isOpenRef);\n\nonClickOutside(rootRef, () => {\n  if (showEmojiPicker.value) {\n    closeEmojiPicker();\n  }\n});\n\nfunction handleInsert(emoji: string): void {\n  emit(\"insert\", emoji);\n  closeEmojiPicker();\n}\n</script>\n\n<template>\n  <div ref=\"rootRef\" class=\"tpl:relative\">\n    <button\n      type=\"button\"\n      class=\"tpl-text-toolbar-btn\"\n      :class=\"{\n        'tpl-text-toolbar-btn--active': showEmojiPicker,\n      }\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      :title=\"t.paragraphEditor.insertEmoji\"\n      :aria-expanded=\"showEmojiPicker\"\n      aria-haspopup=\"dialog\"\n      aria-controls=\"tpl-emoji-picker\"\n      @click=\"toggleEmojiPicker\"\n    >\n      <Smile :size=\"16\" :stroke-width=\"2\" />\n    </button>\n    <div\n      v-if=\"showEmojiPicker\"\n      id=\"tpl-emoji-picker\"\n      ref=\"pickerRef\"\n      role=\"dialog\"\n      aria-modal=\"false\"\n      :aria-label=\"t.paragraphEditor.insertEmoji\"\n      tabindex=\"-1\"\n      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\"\n      @keydown.esc.stop.prevent=\"closeEmojiPicker\"\n    >\n      <div\n        v-for=\"category in emojiCategories\"\n        :key=\"category.key\"\n        class=\"tpl:mb-2 tpl:last:mb-0\"\n      >\n        <div\n          class=\"tpl:mb-1.5 tpl:text-[10px] tpl:font-medium tpl:tracking-wide tpl:text-[var(--tpl-text-muted)] tpl:uppercase\"\n        >\n          {{ t.emoji[category.key] }}\n        </div>\n        <div class=\"tpl:grid tpl:grid-cols-10 tpl:gap-0.5\">\n          <button\n            v-for=\"emoji in category.emojis\"\n            :key=\"emoji\"\n            type=\"button\"\n            :aria-label=\"format(t.paragraphEditor.emojiItemLabel, { emoji })\"\n            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)]\"\n            @click=\"handleInsert(emoji)\"\n          >\n            {{ emoji }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport type { Component } from \"vue\";\n\ndefineProps<{\n  icon: Component;\n  label: string;\n  active?: boolean;\n  strokeWidth?: number;\n  size?: number;\n}>();\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    class=\"tpl-text-toolbar-btn\"\n    :class=\"{ 'tpl-text-toolbar-btn--active': active }\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    :aria-pressed=\"active ? 'true' : 'false'\"\n  >\n    <component :is=\"icon\" :size=\"size ?? 16\" :stroke-width=\"strokeWidth ?? 2\" />\n  </button>\n</template>\n","<script setup lang=\"ts\">\nimport type { Component } from \"vue\";\n\ndefineProps<{\n  icon: Component;\n  label: string;\n  active?: boolean;\n  strokeWidth?: number;\n  size?: number;\n}>();\n</script>\n\n<template>\n  <button\n    type=\"button\"\n    class=\"tpl-text-toolbar-btn\"\n    :class=\"{ 'tpl-text-toolbar-btn--active': active }\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    :aria-pressed=\"active ? 'true' : 'false'\"\n  >\n    <component :is=\"icon\" :size=\"size ?? 16\" :stroke-width=\"strokeWidth ?? 2\" />\n  </button>\n</template>\n","<template>\n  <span\n    class=\"tpl:mx-1 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n    aria-hidden=\"true\"\n  ></span>\n</template>\n","<script setup lang=\"ts\">\ninterface OptionItem {\n  value: string;\n  label: string;\n}\n\ndefineProps<{\n  modelValue: string;\n  options: readonly (string | OptionItem)[];\n  label: string;\n  placeholder?: string;\n  widthClass?: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nfunction onChange(e: Event): void {\n  emit(\"update:modelValue\", (e.target as HTMLSelectElement).value);\n}\n\nfunction optionValue(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.value;\n}\n\nfunction optionLabel(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.label;\n}\n</script>\n\n<template>\n  <select\n    :class=\"[\n      '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',\n      widthClass ?? 'tpl:w-20',\n    ]\"\n    :value=\"modelValue\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    @change=\"onChange\"\n  >\n    <option value=\"\">{{ placeholder ?? \"\" }}</option>\n    <option\n      v-for=\"opt in options\"\n      :key=\"optionValue(opt)\"\n      :value=\"optionValue(opt)\"\n    >\n      {{ optionLabel(opt) }}\n    </option>\n  </select>\n</template>\n","<script setup lang=\"ts\">\ninterface OptionItem {\n  value: string;\n  label: string;\n}\n\ndefineProps<{\n  modelValue: string;\n  options: readonly (string | OptionItem)[];\n  label: string;\n  placeholder?: string;\n  widthClass?: string;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", value: string): void;\n}>();\n\nfunction onChange(e: Event): void {\n  emit(\"update:modelValue\", (e.target as HTMLSelectElement).value);\n}\n\nfunction optionValue(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.value;\n}\n\nfunction optionLabel(opt: string | OptionItem): string {\n  return typeof opt === \"string\" ? opt : opt.label;\n}\n</script>\n\n<template>\n  <select\n    :class=\"[\n      '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',\n      widthClass ?? 'tpl:w-20',\n    ]\"\n    :value=\"modelValue\"\n    :aria-label=\"label\"\n    :title=\"label\"\n    @change=\"onChange\"\n  >\n    <option value=\"\">{{ placeholder ?? \"\" }}</option>\n    <option\n      v-for=\"opt in options\"\n      :key=\"optionValue(opt)\"\n      :value=\"optionValue(opt)\"\n    >\n      {{ optionLabel(opt) }}\n    </option>\n  </select>\n</template>\n","import { DEFAULT_TEXT_COLOR } from \"../constants/styleConstants\";\n\n/**\n * The color a rich-text selection actually renders as, for display in the\n * text-color control (issue #373).\n *\n * Priority: an explicit inline text-color mark on the selection wins; otherwise\n * the text inherits the document-level `textColor`; if that too is unset (older\n * content predating document text color), fall back to the built-in default.\n *\n * A native `<input type=\"color\">` can't represent \"no color\", so before this it\n * always painted a hard-coded `#000000` when no inline mark existed — which both\n * looked like an explicit choice and didn't even match the real inherited color\n * (`#1a1a1a`). Resolving the effective color keeps the swatch truthful: it shows\n * the color the text is actually rendered in, whatever level it comes from.\n */\nexport function resolveEffectiveTextColor(\n  explicitColor: string,\n  documentTextColor: string | undefined,\n): string {\n  return explicitColor || documentTextColor || DEFAULT_TEXT_COLOR;\n}\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport EmojiPickerDropdown from \"./EmojiPickerDropdown.vue\";\nimport ToolbarIconButton from \"../toolbar/ToolbarIconButton.vue\";\nimport ToolbarSeparator from \"../toolbar/ToolbarSeparator.vue\";\nimport ToolbarSelect from \"../toolbar/ToolbarSelect.vue\";\nimport { useI18n } from \"../../composables\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { Editor } from \"@tiptap/core\";\nimport {\n  AlignCenter,\n  AlignLeft,\n  AlignRight,\n  Bold,\n  Italic,\n  Braces,\n  Link,\n  List,\n  ListOrdered,\n  LoaderCircle,\n  RemoveFormatting,\n  ScanLine,\n  Strikethrough,\n  Subscript,\n  Superscript,\n  Underline,\n} from \"@lucide/vue\";\nimport { computed, inject } from \"vue\";\nimport {\n  EDITOR_KEY,\n  THEME_STYLES_KEY,\n  UI_THEME_KEY,\n  FONTS_MANAGER_KEY,\n  MERGE_TAG_PICKER_KEY,\n  LOGIC_TAG_PICKER_KEY,\n  requireInject,\n} from \"../../keys\";\nimport {\n  DEFAULT_HIGHLIGHT_COLOR,\n  FONT_SIZE_OPTIONS,\n  LINE_HEIGHT_OPTIONS,\n  LETTER_SPACING_OPTIONS,\n} from \"../../constants/styleConstants\";\nimport { resolveEffectiveTextColor } from \"../../utils/richTextColor\";\n\nconst props = defineProps<{\n  editor: Editor | null;\n  toolbarPosition: { top: number; left: number };\n  isLoading: boolean;\n  canRequestMergeTag: boolean;\n  canInsertLogicTag: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"open-link-dialog\"): void;\n  (e: \"add-merge-tag\"): void;\n  (e: \"add-logic-tag\"): void;\n}>();\n\nconst themeStyles = inject(THEME_STYLES_KEY, null);\nconst tplUiTheme = inject(UI_THEME_KEY, null);\nconst fontsManager = requireInject(FONTS_MANAGER_KEY, \"ParagraphToolbar\");\nconst popoverRoot = usePopoverRoot();\n// Picker may be null in non-editor contexts (e.g. isolated component tests).\n// When it's provided AND open, hide the floating toolbar — leaving it\n// visible behind the modal is visually noisy and the toolbar's Tailwind\n// z-index utility doesn't compile reliably, so it can sometimes paint\n// over the modal backdrop.\nconst picker = inject(MERGE_TAG_PICKER_KEY, null);\nconst logicPicker = inject(LOGIC_TAG_PICKER_KEY, null);\n// Editor may be absent in isolated tests; used only to resolve the inherited\n// document text color for the text-color swatch.\nconst editorReturn = inject(EDITOR_KEY, null);\n// Hide the floating toolbar while either built-in picker modal is open, so it\n// doesn't overlap the dialog.\nconst pickerIsOpen = computed(\n  () => (picker?.isOpen.value ?? false) || (logicPicker?.isOpen.value ?? false),\n);\n\nconst { t } = useI18n();\n\nconst fontFamilies = fontsManager.fonts;\n\nfunction insertEmoji(emoji: string): void {\n  props.editor?.chain().focus().insertContent(emoji).run();\n}\n\nfunction textStyleAttr(attr: string): string {\n  return (props.editor?.getAttributes(\"textStyle\")[attr] as string) || \"\";\n}\n\nfunction setFontFamily(family: string): void {\n  const chain = props.editor?.chain().focus();\n  if (family) chain?.setFontFamily(family).run();\n  else chain?.unsetFontFamily().run();\n}\n\nfunction setFontSize(size: string): void {\n  const chain = props.editor?.chain().focus();\n  if (size) chain?.setFontSize(size).run();\n  else chain?.unsetFontSize().run();\n}\n\n// When the selection is a link, the color control operates on the link itself\n// (its `color` attribute → inline on the `<a>`) so the link's text and underline\n// stay in sync; otherwise it applies a plain inline text-color mark.\nfunction isLinkSelection(): boolean {\n  return props.editor?.isActive(\"link\") ?? false;\n}\n\nfunction linkColorAttr(): string {\n  return (props.editor?.getAttributes(\"link\").color as string) || \"\";\n}\n\n// Set (or clear, when empty) the color of the current selection. On a link the\n// whole link is recolored (extendMarkRange) so it doesn't split into segments.\nfunction setColor(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (!chain) return;\n  if (isLinkSelection()) {\n    chain.extendMarkRange(\"link\").updateAttributes(\"link\", {\n      color: color || null,\n    });\n    // A per-link color takes absolute priority over any inner text-color: strip\n    // the inline text color on the link range so the `<a>` color alone drives\n    // the glyphs and the underline (mirrors useRichTextLinkDialog.insertLink).\n    // Only when setting a color — clearing leaves the text color untouched.\n    if (color) chain.unsetColor();\n    chain.run();\n  } else if (color) {\n    // A text color applied over a selection that includes a link unifies the\n    // link with it: update the link's own color so the `<a>` (which paints the\n    // underline and is what the dialog/toolbar read) matches the recolored\n    // glyphs. A no-op on a selection with no link. Mirror of the link branch\n    // above — either way a link never ends up with a text color fighting its\n    // own color.\n    chain.setColor(color).updateAttributes(\"link\", { color }).run();\n  } else {\n    chain.unsetColor().run();\n  }\n}\n\n// The color the current selection actually renders in — a link's own color (else\n// the effective document link color: link color, then text color), or for plain\n// text the inline mark else the document text color. Keeps the swatch truthful\n// rather than showing a hard-coded default (issue #373 / per-link color).\nfunction effectiveTextColor(): string {\n  const settings = editorReturn?.content.value.settings;\n  if (isLinkSelection()) {\n    return resolveEffectiveTextColor(\n      linkColorAttr(),\n      settings?.linkColor || settings?.textColor,\n    );\n  }\n  return resolveEffectiveTextColor(textStyleAttr(\"color\"), settings?.textColor);\n}\n\n// The selection's own explicit color: a link's color when on a link, else the\n// inline text-color mark. May be \"\" when the selection only inherits its color\n// — that drives the swatch's set/unset state, while `effectiveTextColor()`\n// seeds the wheel so it still opens on the real rendered color.\nfunction explicitTextColor(): string {\n  return isLinkSelection() ? linkColorAttr() : textStyleAttr(\"color\");\n}\n\nfunction getCurrentLineHeight(): string {\n  return (props.editor?.getAttributes(\"paragraph\").lineHeight as string) || \"\";\n}\n\nfunction setLineHeight(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value) chain?.setLineHeight(value).run();\n  else chain?.unsetLineHeight().run();\n}\n\nfunction setLetterSpacing(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value && value !== \"normal\") chain?.setLetterSpacing(value).run();\n  else chain?.unsetLetterSpacing().run();\n}\n\nfunction getCurrentHighlight(): string {\n  return (props.editor?.getAttributes(\"highlight\").color as string) || \"\";\n}\n\nfunction setHighlight(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (color) chain?.setHighlight({ color }).run();\n  else chain?.unsetHighlight().run();\n}\n</script>\n\n<template>\n  <Teleport v-if=\"popoverRoot && !pickerIsOpen\" :to=\"popoverRoot\">\n    <div\n      :data-tpl-theme=\"tplUiTheme\"\n      role=\"toolbar\"\n      :aria-label=\"t.paragraphEditor.toolbar\"\n      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\"\n      :style=\"{\n        ...themeStyles,\n        top: `${toolbarPosition.top}px`,\n        left: `${toolbarPosition.left}px`,\n        transform: 'translateY(-100%)',\n        flexDirection: 'column',\n      }\"\n    >\n      <template v-if=\"!isLoading && editor\">\n        <!-- Row 1: Font family, Font size, Text color, Bold/Italic/Underline/Strikethrough -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontFamily')\"\n            :options=\"fontFamilies\"\n            :label=\"t.paragraphEditor.fontFamily\"\n            :placeholder=\"t.paragraphEditor.defaultFont\"\n            width-class=\"tpl:w-32\"\n            @update:model-value=\"setFontFamily\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontSize')\"\n            :options=\"FONT_SIZE_OPTIONS\"\n            :label=\"t.paragraphEditor.fontSize\"\n            :placeholder=\"t.paragraphEditor.defaultSize\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setFontSize\"\n          />\n          <ToolbarSeparator />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"text-color-picker\"\n            :model-value=\"explicitTextColor()\"\n            :seed-color=\"effectiveTextColor()\"\n            :aria-label=\"t.paragraphEditor.textColor\"\n            @update:model-value=\"setColor\"\n          />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"highlight-color-picker\"\n            :model-value=\"getCurrentHighlight()\"\n            :seed-color=\"DEFAULT_HIGHLIGHT_COLOR\"\n            :aria-label=\"t.paragraphEditor.highlightColor\"\n            @update:model-value=\"setHighlight\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Bold\"\n            :label=\"t.paragraphEditor.bold\"\n            :active=\"editor.isActive('bold')\"\n            :stroke-width=\"2.5\"\n            @click=\"editor.chain().focus().toggleBold().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Italic\"\n            :label=\"t.paragraphEditor.italic\"\n            :active=\"editor.isActive('italic')\"\n            @click=\"editor.chain().focus().toggleItalic().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Underline\"\n            :label=\"t.paragraphEditor.underline\"\n            :active=\"editor.isActive('underline')\"\n            @click=\"editor.chain().focus().toggleUnderline().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Strikethrough\"\n            :label=\"t.paragraphEditor.strikethrough\"\n            :active=\"editor.isActive('strike')\"\n            @click=\"editor.chain().focus().toggleStrike().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Subscript\"\n            :label=\"t.paragraphEditor.subscript\"\n            :active=\"editor.isActive('subscript')\"\n            @click=\"editor.chain().focus().toggleSubscript().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Superscript\"\n            :label=\"t.paragraphEditor.superscript\"\n            :active=\"editor.isActive('superscript')\"\n            @click=\"editor.chain().focus().toggleSuperscript().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Link\"\n            :label=\"t.paragraphEditor.addLink\"\n            :active=\"editor.isActive('link')\"\n            @click=\"emit('open-link-dialog')\"\n          />\n        </div>\n        <!-- Row 2: Lists, Alignment, LH, LS, Clear, Emoji, Merge tags -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarIconButton\n            :icon=\"List\"\n            :label=\"t.paragraphEditor.bulletList\"\n            :active=\"editor.isActive('bulletList')\"\n            @click=\"editor.chain().focus().toggleBulletList().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"ListOrdered\"\n            :label=\"t.paragraphEditor.numberedList\"\n            :active=\"editor.isActive('orderedList')\"\n            @click=\"editor.chain().focus().toggleOrderedList().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"AlignLeft\"\n            :label=\"t.paragraphEditor.alignLeft\"\n            :active=\"editor.isActive({ textAlign: 'left' })\"\n            @click=\"editor.chain().focus().setTextAlign('left').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignCenter\"\n            :label=\"t.paragraphEditor.alignCenter\"\n            :active=\"editor.isActive({ textAlign: 'center' })\"\n            @click=\"editor.chain().focus().setTextAlign('center').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignRight\"\n            :label=\"t.paragraphEditor.alignRight\"\n            :active=\"editor.isActive({ textAlign: 'right' })\"\n            @click=\"editor.chain().focus().setTextAlign('right').run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarSelect\n            :model-value=\"getCurrentLineHeight()\"\n            :options=\"LINE_HEIGHT_OPTIONS\"\n            :label=\"t.paragraphEditor.lineHeight\"\n            placeholder=\"LH\"\n            width-class=\"tpl:w-16\"\n            @update:model-value=\"setLineHeight\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('letterSpacing')\"\n            :options=\"LETTER_SPACING_OPTIONS\"\n            :label=\"t.paragraphEditor.letterSpacing\"\n            placeholder=\"LS\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setLetterSpacing\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"RemoveFormatting\"\n            :label=\"t.paragraphEditor.clearFormatting\"\n            @click=\"editor.chain().focus().clearNodes().unsetAllMarks().run()\"\n          />\n          <ToolbarSeparator />\n          <EmojiPickerDropdown @insert=\"insertEmoji\" />\n          <template v-if=\"canRequestMergeTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              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)]\"\n              :aria-label=\"t.mergeTag.insert\"\n              :title=\"t.mergeTag.insert\"\n              @click=\"emit('add-merge-tag')\"\n            >\n              <ScanLine :size=\"16\" :stroke-width=\"2\" />\n              {{ t.mergeTag.insertShort }}\n            </button>\n          </template>\n          <template v-if=\"canInsertLogicTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              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)]\"\n              :aria-label=\"t.logicTag.insert\"\n              :title=\"t.logicTag.insert\"\n              data-testid=\"insert-logic-button\"\n              @click=\"emit('add-logic-tag')\"\n            >\n              <Braces :size=\"16\" :stroke-width=\"2\" />\n              {{ t.logicTag.insertShort }}\n            </button>\n          </template>\n        </div>\n      </template>\n      <template v-else>\n        <div\n          class=\"tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n        >\n          <LoaderCircle class=\"tpl-spinner\" :size=\"14\" :stroke-width=\"2\" />\n          {{ t.errors.editorLoading }}\n        </div>\n      </template>\n    </div>\n  </Teleport>\n</template>\n","<script setup lang=\"ts\">\nimport ColorPicker from \"../ColorPicker.vue\";\nimport EmojiPickerDropdown from \"./EmojiPickerDropdown.vue\";\nimport ToolbarIconButton from \"../toolbar/ToolbarIconButton.vue\";\nimport ToolbarSeparator from \"../toolbar/ToolbarSeparator.vue\";\nimport ToolbarSelect from \"../toolbar/ToolbarSelect.vue\";\nimport { useI18n } from \"../../composables\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { Editor } from \"@tiptap/core\";\nimport {\n  AlignCenter,\n  AlignLeft,\n  AlignRight,\n  Bold,\n  Italic,\n  Braces,\n  Link,\n  List,\n  ListOrdered,\n  LoaderCircle,\n  RemoveFormatting,\n  ScanLine,\n  Strikethrough,\n  Subscript,\n  Superscript,\n  Underline,\n} from \"@lucide/vue\";\nimport { computed, inject } from \"vue\";\nimport {\n  EDITOR_KEY,\n  THEME_STYLES_KEY,\n  UI_THEME_KEY,\n  FONTS_MANAGER_KEY,\n  MERGE_TAG_PICKER_KEY,\n  LOGIC_TAG_PICKER_KEY,\n  requireInject,\n} from \"../../keys\";\nimport {\n  DEFAULT_HIGHLIGHT_COLOR,\n  FONT_SIZE_OPTIONS,\n  LINE_HEIGHT_OPTIONS,\n  LETTER_SPACING_OPTIONS,\n} from \"../../constants/styleConstants\";\nimport { resolveEffectiveTextColor } from \"../../utils/richTextColor\";\n\nconst props = defineProps<{\n  editor: Editor | null;\n  toolbarPosition: { top: number; left: number };\n  isLoading: boolean;\n  canRequestMergeTag: boolean;\n  canInsertLogicTag: boolean;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"open-link-dialog\"): void;\n  (e: \"add-merge-tag\"): void;\n  (e: \"add-logic-tag\"): void;\n}>();\n\nconst themeStyles = inject(THEME_STYLES_KEY, null);\nconst tplUiTheme = inject(UI_THEME_KEY, null);\nconst fontsManager = requireInject(FONTS_MANAGER_KEY, \"ParagraphToolbar\");\nconst popoverRoot = usePopoverRoot();\n// Picker may be null in non-editor contexts (e.g. isolated component tests).\n// When it's provided AND open, hide the floating toolbar — leaving it\n// visible behind the modal is visually noisy and the toolbar's Tailwind\n// z-index utility doesn't compile reliably, so it can sometimes paint\n// over the modal backdrop.\nconst picker = inject(MERGE_TAG_PICKER_KEY, null);\nconst logicPicker = inject(LOGIC_TAG_PICKER_KEY, null);\n// Editor may be absent in isolated tests; used only to resolve the inherited\n// document text color for the text-color swatch.\nconst editorReturn = inject(EDITOR_KEY, null);\n// Hide the floating toolbar while either built-in picker modal is open, so it\n// doesn't overlap the dialog.\nconst pickerIsOpen = computed(\n  () => (picker?.isOpen.value ?? false) || (logicPicker?.isOpen.value ?? false),\n);\n\nconst { t } = useI18n();\n\nconst fontFamilies = fontsManager.fonts;\n\nfunction insertEmoji(emoji: string): void {\n  props.editor?.chain().focus().insertContent(emoji).run();\n}\n\nfunction textStyleAttr(attr: string): string {\n  return (props.editor?.getAttributes(\"textStyle\")[attr] as string) || \"\";\n}\n\nfunction setFontFamily(family: string): void {\n  const chain = props.editor?.chain().focus();\n  if (family) chain?.setFontFamily(family).run();\n  else chain?.unsetFontFamily().run();\n}\n\nfunction setFontSize(size: string): void {\n  const chain = props.editor?.chain().focus();\n  if (size) chain?.setFontSize(size).run();\n  else chain?.unsetFontSize().run();\n}\n\n// When the selection is a link, the color control operates on the link itself\n// (its `color` attribute → inline on the `<a>`) so the link's text and underline\n// stay in sync; otherwise it applies a plain inline text-color mark.\nfunction isLinkSelection(): boolean {\n  return props.editor?.isActive(\"link\") ?? false;\n}\n\nfunction linkColorAttr(): string {\n  return (props.editor?.getAttributes(\"link\").color as string) || \"\";\n}\n\n// Set (or clear, when empty) the color of the current selection. On a link the\n// whole link is recolored (extendMarkRange) so it doesn't split into segments.\nfunction setColor(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (!chain) return;\n  if (isLinkSelection()) {\n    chain.extendMarkRange(\"link\").updateAttributes(\"link\", {\n      color: color || null,\n    });\n    // A per-link color takes absolute priority over any inner text-color: strip\n    // the inline text color on the link range so the `<a>` color alone drives\n    // the glyphs and the underline (mirrors useRichTextLinkDialog.insertLink).\n    // Only when setting a color — clearing leaves the text color untouched.\n    if (color) chain.unsetColor();\n    chain.run();\n  } else if (color) {\n    // A text color applied over a selection that includes a link unifies the\n    // link with it: update the link's own color so the `<a>` (which paints the\n    // underline and is what the dialog/toolbar read) matches the recolored\n    // glyphs. A no-op on a selection with no link. Mirror of the link branch\n    // above — either way a link never ends up with a text color fighting its\n    // own color.\n    chain.setColor(color).updateAttributes(\"link\", { color }).run();\n  } else {\n    chain.unsetColor().run();\n  }\n}\n\n// The color the current selection actually renders in — a link's own color (else\n// the effective document link color: link color, then text color), or for plain\n// text the inline mark else the document text color. Keeps the swatch truthful\n// rather than showing a hard-coded default (issue #373 / per-link color).\nfunction effectiveTextColor(): string {\n  const settings = editorReturn?.content.value.settings;\n  if (isLinkSelection()) {\n    return resolveEffectiveTextColor(\n      linkColorAttr(),\n      settings?.linkColor || settings?.textColor,\n    );\n  }\n  return resolveEffectiveTextColor(textStyleAttr(\"color\"), settings?.textColor);\n}\n\n// The selection's own explicit color: a link's color when on a link, else the\n// inline text-color mark. May be \"\" when the selection only inherits its color\n// — that drives the swatch's set/unset state, while `effectiveTextColor()`\n// seeds the wheel so it still opens on the real rendered color.\nfunction explicitTextColor(): string {\n  return isLinkSelection() ? linkColorAttr() : textStyleAttr(\"color\");\n}\n\nfunction getCurrentLineHeight(): string {\n  return (props.editor?.getAttributes(\"paragraph\").lineHeight as string) || \"\";\n}\n\nfunction setLineHeight(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value) chain?.setLineHeight(value).run();\n  else chain?.unsetLineHeight().run();\n}\n\nfunction setLetterSpacing(value: string): void {\n  const chain = props.editor?.chain().focus();\n  if (value && value !== \"normal\") chain?.setLetterSpacing(value).run();\n  else chain?.unsetLetterSpacing().run();\n}\n\nfunction getCurrentHighlight(): string {\n  return (props.editor?.getAttributes(\"highlight\").color as string) || \"\";\n}\n\nfunction setHighlight(color: string): void {\n  const chain = props.editor?.chain().focus();\n  if (color) chain?.setHighlight({ color }).run();\n  else chain?.unsetHighlight().run();\n}\n</script>\n\n<template>\n  <Teleport v-if=\"popoverRoot && !pickerIsOpen\" :to=\"popoverRoot\">\n    <div\n      :data-tpl-theme=\"tplUiTheme\"\n      role=\"toolbar\"\n      :aria-label=\"t.paragraphEditor.toolbar\"\n      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\"\n      :style=\"{\n        ...themeStyles,\n        top: `${toolbarPosition.top}px`,\n        left: `${toolbarPosition.left}px`,\n        transform: 'translateY(-100%)',\n        flexDirection: 'column',\n      }\"\n    >\n      <template v-if=\"!isLoading && editor\">\n        <!-- Row 1: Font family, Font size, Text color, Bold/Italic/Underline/Strikethrough -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontFamily')\"\n            :options=\"fontFamilies\"\n            :label=\"t.paragraphEditor.fontFamily\"\n            :placeholder=\"t.paragraphEditor.defaultFont\"\n            width-class=\"tpl:w-32\"\n            @update:model-value=\"setFontFamily\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('fontSize')\"\n            :options=\"FONT_SIZE_OPTIONS\"\n            :label=\"t.paragraphEditor.fontSize\"\n            :placeholder=\"t.paragraphEditor.defaultSize\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setFontSize\"\n          />\n          <ToolbarSeparator />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"text-color-picker\"\n            :model-value=\"explicitTextColor()\"\n            :seed-color=\"effectiveTextColor()\"\n            :aria-label=\"t.paragraphEditor.textColor\"\n            @update:model-value=\"setColor\"\n          />\n          <ColorPicker\n            swatch-only\n            size=\"sm\"\n            data-testid=\"highlight-color-picker\"\n            :model-value=\"getCurrentHighlight()\"\n            :seed-color=\"DEFAULT_HIGHLIGHT_COLOR\"\n            :aria-label=\"t.paragraphEditor.highlightColor\"\n            @update:model-value=\"setHighlight\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Bold\"\n            :label=\"t.paragraphEditor.bold\"\n            :active=\"editor.isActive('bold')\"\n            :stroke-width=\"2.5\"\n            @click=\"editor.chain().focus().toggleBold().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Italic\"\n            :label=\"t.paragraphEditor.italic\"\n            :active=\"editor.isActive('italic')\"\n            @click=\"editor.chain().focus().toggleItalic().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Underline\"\n            :label=\"t.paragraphEditor.underline\"\n            :active=\"editor.isActive('underline')\"\n            @click=\"editor.chain().focus().toggleUnderline().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Strikethrough\"\n            :label=\"t.paragraphEditor.strikethrough\"\n            :active=\"editor.isActive('strike')\"\n            @click=\"editor.chain().focus().toggleStrike().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Subscript\"\n            :label=\"t.paragraphEditor.subscript\"\n            :active=\"editor.isActive('subscript')\"\n            @click=\"editor.chain().focus().toggleSubscript().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"Superscript\"\n            :label=\"t.paragraphEditor.superscript\"\n            :active=\"editor.isActive('superscript')\"\n            @click=\"editor.chain().focus().toggleSuperscript().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"Link\"\n            :label=\"t.paragraphEditor.addLink\"\n            :active=\"editor.isActive('link')\"\n            @click=\"emit('open-link-dialog')\"\n          />\n        </div>\n        <!-- Row 2: Lists, Alignment, LH, LS, Clear, Emoji, Merge tags -->\n        <div class=\"tpl:flex tpl:items-center tpl:gap-1\">\n          <ToolbarIconButton\n            :icon=\"List\"\n            :label=\"t.paragraphEditor.bulletList\"\n            :active=\"editor.isActive('bulletList')\"\n            @click=\"editor.chain().focus().toggleBulletList().run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"ListOrdered\"\n            :label=\"t.paragraphEditor.numberedList\"\n            :active=\"editor.isActive('orderedList')\"\n            @click=\"editor.chain().focus().toggleOrderedList().run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"AlignLeft\"\n            :label=\"t.paragraphEditor.alignLeft\"\n            :active=\"editor.isActive({ textAlign: 'left' })\"\n            @click=\"editor.chain().focus().setTextAlign('left').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignCenter\"\n            :label=\"t.paragraphEditor.alignCenter\"\n            :active=\"editor.isActive({ textAlign: 'center' })\"\n            @click=\"editor.chain().focus().setTextAlign('center').run()\"\n          />\n          <ToolbarIconButton\n            :icon=\"AlignRight\"\n            :label=\"t.paragraphEditor.alignRight\"\n            :active=\"editor.isActive({ textAlign: 'right' })\"\n            @click=\"editor.chain().focus().setTextAlign('right').run()\"\n          />\n          <ToolbarSeparator />\n          <ToolbarSelect\n            :model-value=\"getCurrentLineHeight()\"\n            :options=\"LINE_HEIGHT_OPTIONS\"\n            :label=\"t.paragraphEditor.lineHeight\"\n            placeholder=\"LH\"\n            width-class=\"tpl:w-16\"\n            @update:model-value=\"setLineHeight\"\n          />\n          <ToolbarSelect\n            :model-value=\"textStyleAttr('letterSpacing')\"\n            :options=\"LETTER_SPACING_OPTIONS\"\n            :label=\"t.paragraphEditor.letterSpacing\"\n            placeholder=\"LS\"\n            width-class=\"tpl:w-20\"\n            @update:model-value=\"setLetterSpacing\"\n          />\n          <ToolbarSeparator />\n          <ToolbarIconButton\n            :icon=\"RemoveFormatting\"\n            :label=\"t.paragraphEditor.clearFormatting\"\n            @click=\"editor.chain().focus().clearNodes().unsetAllMarks().run()\"\n          />\n          <ToolbarSeparator />\n          <EmojiPickerDropdown @insert=\"insertEmoji\" />\n          <template v-if=\"canRequestMergeTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              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)]\"\n              :aria-label=\"t.mergeTag.insert\"\n              :title=\"t.mergeTag.insert\"\n              @click=\"emit('add-merge-tag')\"\n            >\n              <ScanLine :size=\"16\" :stroke-width=\"2\" />\n              {{ t.mergeTag.insertShort }}\n            </button>\n          </template>\n          <template v-if=\"canInsertLogicTag\">\n            <ToolbarSeparator />\n            <button\n              type=\"button\"\n              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)]\"\n              :aria-label=\"t.logicTag.insert\"\n              :title=\"t.logicTag.insert\"\n              data-testid=\"insert-logic-button\"\n              @click=\"emit('add-logic-tag')\"\n            >\n              <Braces :size=\"16\" :stroke-width=\"2\" />\n              {{ t.logicTag.insertShort }}\n            </button>\n          </template>\n        </div>\n      </template>\n      <template v-else>\n        <div\n          class=\"tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n        >\n          <LoaderCircle class=\"tpl-spinner\" :size=\"14\" :stroke-width=\"2\" />\n          {{ t.errors.editorLoading }}\n        </div>\n      </template>\n    </div>\n  </Teleport>\n</template>\n","<script setup lang=\"ts\">\nimport { useRichTextEditor } from \"../../composables/useRichTextEditor\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { ParagraphBlock as ParagraphBlockType } from \"@templatical/types\";\nimport ParagraphToolbar from \"./ParagraphToolbar.vue\";\nimport RichTextLinkDialog from \"./RichTextLinkDialog.vue\";\nimport RichTextEditorContent from \"./RichTextEditorContent.vue\";\nimport { withLinkColor } from \"../../utils/linkColorExtension\";\n\nconst props = defineProps<{\n  block: ParagraphBlockType;\n  toolbarPosition: { top: number; left: number };\n}>();\n\nconst emit = defineEmits<{\n  (e: \"done\"): void;\n}>();\n\nconst popoverRoot = usePopoverRoot();\n\nconst {\n  editor,\n  EditorContent,\n  isLoading,\n  initError,\n  retry,\n  showLinkDialog,\n  linkUrl,\n  linkColor,\n  linkDialogRef,\n  canRequestMergeTag,\n  canInsertLogicTag,\n  openLinkDialog,\n  insertLink,\n  removeLink,\n  closeLinkDialog,\n  handleLinkKeydown,\n  handleAddMergeTag,\n  handleAddLogicTag,\n} = useRichTextEditor({\n  blockId: () => props.block.id,\n  blockContent: () => props.block.content,\n  onDone: () => emit(\"done\"),\n  editorName: \"ParagraphEditor\",\n  async loadExtensions({\n    mergeTags,\n    syntax,\n    triggerChar,\n    autocompleteEnabled,\n    suggestionEmptyText,\n  }) {\n    const [\n      { Editor: TiptapEditor, EditorContent: EC },\n      { default: StarterKit },\n      { default: LinkExt },\n      { default: UnderlineExt },\n      { default: SubscriptExt },\n      { default: SuperscriptExt },\n      { default: TextAlign },\n      { TextStyle },\n      { default: Color },\n      { default: FontFamily },\n      { default: Highlight },\n      {\n        MergeTagNode,\n        MergeTagSuggestion,\n        LogicMergeTagNode,\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n      },\n    ] = await Promise.all([\n      import(\"@tiptap/vue-3\"),\n      import(\"@tiptap/starter-kit\"),\n      import(\"@tiptap/extension-link\"),\n      import(\"@tiptap/extension-underline\"),\n      import(\"@tiptap/extension-subscript\"),\n      import(\"@tiptap/extension-superscript\"),\n      import(\"@tiptap/extension-text-align\"),\n      import(\"@tiptap/extension-text-style\"),\n      import(\"@tiptap/extension-color\"),\n      import(\"@tiptap/extension-font-family\"),\n      import(\"@tiptap/extension-highlight\"),\n      import(\"../../extensions\"),\n    ]);\n\n    return {\n      TiptapEditor,\n      EC,\n      extensions: [\n        StarterKit.configure({\n          heading: false,\n          codeBlock: false,\n          blockquote: false,\n          horizontalRule: false,\n          // StarterKit bundles @tiptap/extension-link (openOnClick: true).\n          // Disable it so the LinkExt below (openOnClick: false) is the only\n          // link extension — otherwise clicking a link while editing opens it.\n          link: false,\n          // StarterKit also bundles @tiptap/extension-underline; the editor\n          // registers its own UnderlineExt below, so disable StarterKit's copy\n          // to avoid a duplicate `underline` extension (and its console warning).\n          underline: false,\n        }),\n        UnderlineExt,\n        SubscriptExt,\n        SuperscriptExt,\n        withLinkColor(LinkExt).configure({\n          openOnClick: false,\n          HTMLAttributes: {\n            target: \"_blank\",\n            rel: \"noopener noreferrer\",\n          },\n        }),\n        TextAlign.configure({ types: [\"paragraph\"] }),\n        TextStyle,\n        Color,\n        FontFamily,\n        Highlight.configure({ multicolor: true }),\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n        MergeTagNode.configure({ mergeTags, syntax }),\n        LogicMergeTagNode.configure({ syntax }),\n        ...(autocompleteEnabled && triggerChar && mergeTags.length > 0\n          ? [\n              MergeTagSuggestion.configure({\n                mergeTags,\n                char: triggerChar,\n                emptyText: suggestionEmptyText,\n                popoverRoot,\n              }),\n            ]\n          : []),\n      ],\n    };\n  },\n});\n</script>\n\n<template>\n  <div class=\"tpl-text-editor-wrapper tpl:relative\">\n    <ParagraphToolbar\n      :editor=\"editor\"\n      :toolbar-position=\"toolbarPosition\"\n      :is-loading=\"isLoading\"\n      :can-request-merge-tag=\"canRequestMergeTag\"\n      :can-insert-logic-tag=\"canInsertLogicTag\"\n      @open-link-dialog=\"openLinkDialog\"\n      @add-merge-tag=\"handleAddMergeTag\"\n      @add-logic-tag=\"handleAddLogicTag\"\n    />\n\n    <RichTextEditorContent\n      :editor=\"editor\"\n      :editor-content=\"EditorContent\"\n      :is-loading=\"isLoading\"\n      :init-error=\"initError\"\n      @retry=\"retry\"\n    />\n\n    <RichTextLinkDialog\n      :visible=\"showLinkDialog\"\n      :is-editing-link=\"editor?.isActive('link') ?? false\"\n      v-model:dialog-ref=\"linkDialogRef\"\n      v-model:link-url=\"linkUrl\"\n      v-model:link-color=\"linkColor\"\n      @close=\"closeLinkDialog\"\n      @insert=\"insertLink\"\n      @remove=\"removeLink\"\n      @keydown=\"handleLinkKeydown\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { useRichTextEditor } from \"../../composables/useRichTextEditor\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { ParagraphBlock as ParagraphBlockType } from \"@templatical/types\";\nimport ParagraphToolbar from \"./ParagraphToolbar.vue\";\nimport RichTextLinkDialog from \"./RichTextLinkDialog.vue\";\nimport RichTextEditorContent from \"./RichTextEditorContent.vue\";\nimport { withLinkColor } from \"../../utils/linkColorExtension\";\n\nconst props = defineProps<{\n  block: ParagraphBlockType;\n  toolbarPosition: { top: number; left: number };\n}>();\n\nconst emit = defineEmits<{\n  (e: \"done\"): void;\n}>();\n\nconst popoverRoot = usePopoverRoot();\n\nconst {\n  editor,\n  EditorContent,\n  isLoading,\n  initError,\n  retry,\n  showLinkDialog,\n  linkUrl,\n  linkColor,\n  linkDialogRef,\n  canRequestMergeTag,\n  canInsertLogicTag,\n  openLinkDialog,\n  insertLink,\n  removeLink,\n  closeLinkDialog,\n  handleLinkKeydown,\n  handleAddMergeTag,\n  handleAddLogicTag,\n} = useRichTextEditor({\n  blockId: () => props.block.id,\n  blockContent: () => props.block.content,\n  onDone: () => emit(\"done\"),\n  editorName: \"ParagraphEditor\",\n  async loadExtensions({\n    mergeTags,\n    syntax,\n    triggerChar,\n    autocompleteEnabled,\n    suggestionEmptyText,\n  }) {\n    const [\n      { Editor: TiptapEditor, EditorContent: EC },\n      { default: StarterKit },\n      { default: LinkExt },\n      { default: UnderlineExt },\n      { default: SubscriptExt },\n      { default: SuperscriptExt },\n      { default: TextAlign },\n      { TextStyle },\n      { default: Color },\n      { default: FontFamily },\n      { default: Highlight },\n      {\n        MergeTagNode,\n        MergeTagSuggestion,\n        LogicMergeTagNode,\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n      },\n    ] = await Promise.all([\n      import(\"@tiptap/vue-3\"),\n      import(\"@tiptap/starter-kit\"),\n      import(\"@tiptap/extension-link\"),\n      import(\"@tiptap/extension-underline\"),\n      import(\"@tiptap/extension-subscript\"),\n      import(\"@tiptap/extension-superscript\"),\n      import(\"@tiptap/extension-text-align\"),\n      import(\"@tiptap/extension-text-style\"),\n      import(\"@tiptap/extension-color\"),\n      import(\"@tiptap/extension-font-family\"),\n      import(\"@tiptap/extension-highlight\"),\n      import(\"../../extensions\"),\n    ]);\n\n    return {\n      TiptapEditor,\n      EC,\n      extensions: [\n        StarterKit.configure({\n          heading: false,\n          codeBlock: false,\n          blockquote: false,\n          horizontalRule: false,\n          // StarterKit bundles @tiptap/extension-link (openOnClick: true).\n          // Disable it so the LinkExt below (openOnClick: false) is the only\n          // link extension — otherwise clicking a link while editing opens it.\n          link: false,\n          // StarterKit also bundles @tiptap/extension-underline; the editor\n          // registers its own UnderlineExt below, so disable StarterKit's copy\n          // to avoid a duplicate `underline` extension (and its console warning).\n          underline: false,\n        }),\n        UnderlineExt,\n        SubscriptExt,\n        SuperscriptExt,\n        withLinkColor(LinkExt).configure({\n          openOnClick: false,\n          HTMLAttributes: {\n            target: \"_blank\",\n            rel: \"noopener noreferrer\",\n          },\n        }),\n        TextAlign.configure({ types: [\"paragraph\"] }),\n        TextStyle,\n        Color,\n        FontFamily,\n        Highlight.configure({ multicolor: true }),\n        FontSize,\n        LineHeight,\n        LetterSpacing,\n        MergeTagNode.configure({ mergeTags, syntax }),\n        LogicMergeTagNode.configure({ syntax }),\n        ...(autocompleteEnabled && triggerChar && mergeTags.length > 0\n          ? [\n              MergeTagSuggestion.configure({\n                mergeTags,\n                char: triggerChar,\n                emptyText: suggestionEmptyText,\n                popoverRoot,\n              }),\n            ]\n          : []),\n      ],\n    };\n  },\n});\n</script>\n\n<template>\n  <div class=\"tpl-text-editor-wrapper tpl:relative\">\n    <ParagraphToolbar\n      :editor=\"editor\"\n      :toolbar-position=\"toolbarPosition\"\n      :is-loading=\"isLoading\"\n      :can-request-merge-tag=\"canRequestMergeTag\"\n      :can-insert-logic-tag=\"canInsertLogicTag\"\n      @open-link-dialog=\"openLinkDialog\"\n      @add-merge-tag=\"handleAddMergeTag\"\n      @add-logic-tag=\"handleAddLogicTag\"\n    />\n\n    <RichTextEditorContent\n      :editor=\"editor\"\n      :editor-content=\"EditorContent\"\n      :is-loading=\"isLoading\"\n      :init-error=\"initError\"\n      @retry=\"retry\"\n    />\n\n    <RichTextLinkDialog\n      :visible=\"showLinkDialog\"\n      :is-editing-link=\"editor?.isActive('link') ?? false\"\n      v-model:dialog-ref=\"linkDialogRef\"\n      v-model:link-url=\"linkUrl\"\n      v-model:link-color=\"linkColor\"\n      @close=\"closeLinkDialog\"\n      @insert=\"insertLink\"\n      @remove=\"removeLink\"\n      @keydown=\"handleLinkKeydown\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/cdn/chunks/SaveModuleDialog-mr9A4j6G.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SaveModuleDialog-mr9A4j6G.js","names":[],"sources":["../../../src/cloud/components/SaveModuleDialog.vue","../../../src/cloud/components/SaveModuleDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport TplModal from \"../../components/TplModal.vue\";\nimport { useI18n } from \"../../composables\";\nimport { useCloudI18nStrict } from \"../../composables\";\nimport {\n  EDITOR_KEY,\n  SAVED_MODULES_HEADLESS_KEY,\n  requireInject,\n} from \"../../keys\";\nimport type { Block } from \"@templatical/types\";\nimport { LoaderCircle } from \"@lucide/vue\";\nimport { computed, ref, watch } from \"vue\";\n\nconst props = defineProps<{\n  visible: boolean;\n  preSelectedBlockId: string | null;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"close\"): void;\n  (e: \"saved\"): void;\n}>();\n\nconst { t } = useI18n();\nconst { t: cloudT } = useCloudI18nStrict();\nconst editor = requireInject(EDITOR_KEY, \"SaveModuleDialog\");\nconst savedModules = requireInject(\n  SAVED_MODULES_HEADLESS_KEY,\n  \"SaveModuleDialog\",\n);\n\nconst moduleName = ref(\"\");\nconst selectedBlockIds = ref<Set<string>>(new Set());\nconst isSaving = ref(false);\nconst error = ref<string | null>(null);\n\nconst topLevelBlocks = computed(() => editor.content.value.blocks);\n\nfunction blockLabel(block: Block, index: number): string {\n  const typeKey = block.type as keyof typeof t.blocks;\n  const label = t.blocks[typeKey] ?? block.type;\n  return `${label} ${index + 1}`;\n}\n\nwatch(\n  () => props.visible,\n  (visible) => {\n    if (visible) {\n      moduleName.value = \"\";\n      error.value = null;\n      selectedBlockIds.value = new Set(\n        props.preSelectedBlockId ? [props.preSelectedBlockId] : [],\n      );\n    }\n  },\n);\n\nfunction toggleBlock(blockId: string): void {\n  const newSet = new Set(selectedBlockIds.value);\n  if (newSet.has(blockId)) {\n    newSet.delete(blockId);\n  } else {\n    newSet.add(blockId);\n  }\n  selectedBlockIds.value = newSet;\n}\n\nconst canSave = computed(\n  () =>\n    moduleName.value.trim().length > 0 &&\n    selectedBlockIds.value.size > 0 &&\n    !isSaving.value,\n);\n\nasync function handleSave(): Promise<void> {\n  if (!canSave.value) return;\n\n  isSaving.value = true;\n  error.value = null;\n\n  try {\n    const selectedBlocks = topLevelBlocks.value.filter((b) =>\n      selectedBlockIds.value.has(b.id),\n    );\n    await savedModules.createModule(moduleName.value.trim(), selectedBlocks);\n    emit(\"saved\");\n    emit(\"close\");\n  } catch (err) {\n    error.value = (err as Error).message;\n  } finally {\n    isSaving.value = false;\n  }\n}\n\nfunction handleClose(): void {\n  if (!isSaving.value) {\n    emit(\"close\");\n  }\n}\n\nfunction handleKeydown(event: KeyboardEvent): void {\n  if (event.key === \"Enter\" && !event.shiftKey) {\n    event.preventDefault();\n    handleSave();\n  }\n  if (event.key === \"Escape\") {\n    handleClose();\n  }\n}\n</script>\n\n<template>\n  <TplModal :visible=\"visible\" @close=\"handleClose\" @keydown=\"handleKeydown\">\n    <div\n      role=\"dialog\"\n      aria-modal=\"true\"\n      :aria-busy=\"isSaving\"\n      aria-labelledby=\"tpl-save-module-title\"\n      class=\"tpl-scale-in tpl:mx-4 tpl:w-full tpl:max-w-sm tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5\"\n      style=\"\n        background-color: var(--tpl-bg-elevated);\n        box-shadow: var(--tpl-shadow-xl);\n      \"\n    >\n      <h3\n        id=\"tpl-save-module-title\"\n        class=\"tpl:mb-4 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n      >\n        {{ cloudT.modules.saveAsModule }}\n      </h3>\n\n      <!-- Module name -->\n      <div class=\"tpl:mb-3\">\n        <label\n          class=\"tpl:mb-1.5 tpl:block tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]\"\n        >\n          {{ cloudT.modules.moduleName }}\n        </label>\n        <input\n          v-model=\"moduleName\"\n          type=\"text\"\n          :placeholder=\"cloudT.modules.moduleNamePlaceholder\"\n          class=\"tpl:h-9 tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1 tpl:text-sm tpl:shadow-xs tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]\"\n          :disabled=\"isSaving\"\n        />\n      </div>\n\n      <!-- Block selection -->\n      <div class=\"tpl:mb-3\">\n        <label\n          class=\"tpl:mb-1.5 tpl:block tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]\"\n        >\n          {{ cloudT.modules.selectBlocks }}\n        </label>\n        <div\n          class=\"tpl:max-h-40 tpl:space-y-1 tpl:overflow-y-auto tpl:rounded-md tpl:border tpl:p-2 tpl:border-[var(--tpl-border)]\"\n        >\n          <label\n            v-for=\"(block, index) in topLevelBlocks\"\n            :key=\"block.id\"\n            class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:rounded-sm tpl:px-2 tpl:py-1.5 tpl:text-sm tpl:transition-colors tpl:duration-100\"\n            :style=\"{\n              color: 'var(--tpl-text)',\n              backgroundColor: selectedBlockIds.has(block.id)\n                ? 'var(--tpl-primary-light)'\n                : 'transparent',\n            }\"\n          >\n            <input\n              type=\"checkbox\"\n              :checked=\"selectedBlockIds.has(block.id)\"\n              class=\"tpl:accent-[var(--tpl-primary)]\"\n              :disabled=\"isSaving\"\n              @change=\"toggleBlock(block.id)\"\n            />\n            {{ blockLabel(block, index) }}\n          </label>\n        </div>\n      </div>\n\n      <!-- Error message -->\n      <p\n        v-if=\"error\"\n        role=\"alert\"\n        class=\"tpl:mb-3 tpl:text-xs tpl:text-[var(--tpl-danger)]\"\n      >\n        {{ error }}\n      </p>\n\n      <!-- Actions -->\n      <div class=\"tpl:flex tpl:justify-end tpl:gap-2\">\n        <button\n          type=\"button\"\n          class=\"tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:border-[var(--tpl-border)] tpl:text-[var(--tpl-text)] tpl:bg-[var(--tpl-bg)]\"\n          :disabled=\"isSaving\"\n          :class=\"{\n            'tpl:cursor-not-allowed tpl:opacity-50': isSaving,\n          }\"\n          @click=\"handleClose\"\n        >\n          {{ cloudT.modules.cancel }}\n        </button>\n        <button\n          type=\"button\"\n          class=\"tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:hover:opacity-90 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50 tpl:bg-[var(--tpl-primary)] tpl:text-[var(--tpl-bg)]\"\n          :disabled=\"!canSave\"\n          @click=\"handleSave\"\n        >\n          <span v-if=\"isSaving\" class=\"tpl:flex tpl:items-center tpl:gap-1.5\">\n            <LoaderCircle\n              class=\"tpl:animate-spin\"\n              :size=\"12\"\n              :stroke-width=\"2\"\n            />\n            {{ cloudT.modules.saving }}\n          </span>\n          <span v-else>\n            {{ cloudT.modules.save }}\n          </span>\n        </button>\n      </div>\n    </div>\n  </TplModal>\n</template>\n","<script setup lang=\"ts\">\nimport TplModal from \"../../components/TplModal.vue\";\nimport { useI18n } from \"../../composables\";\nimport { useCloudI18nStrict } from \"../../composables\";\nimport {\n  EDITOR_KEY,\n  SAVED_MODULES_HEADLESS_KEY,\n  requireInject,\n} from \"../../keys\";\nimport type { Block } from \"@templatical/types\";\nimport { LoaderCircle } from \"@lucide/vue\";\nimport { computed, ref, watch } from \"vue\";\n\nconst props = defineProps<{\n  visible: boolean;\n  preSelectedBlockId: string | null;\n}>();\n\nconst emit = defineEmits<{\n  (e: \"close\"): void;\n  (e: \"saved\"): void;\n}>();\n\nconst { t } = useI18n();\nconst { t: cloudT } = useCloudI18nStrict();\nconst editor = requireInject(EDITOR_KEY, \"SaveModuleDialog\");\nconst savedModules = requireInject(\n  SAVED_MODULES_HEADLESS_KEY,\n  \"SaveModuleDialog\",\n);\n\nconst moduleName = ref(\"\");\nconst selectedBlockIds = ref<Set<string>>(new Set());\nconst isSaving = ref(false);\nconst error = ref<string | null>(null);\n\nconst topLevelBlocks = computed(() => editor.content.value.blocks);\n\nfunction blockLabel(block: Block, index: number): string {\n  const typeKey = block.type as keyof typeof t.blocks;\n  const label = t.blocks[typeKey] ?? block.type;\n  return `${label} ${index + 1}`;\n}\n\nwatch(\n  () => props.visible,\n  (visible) => {\n    if (visible) {\n      moduleName.value = \"\";\n      error.value = null;\n      selectedBlockIds.value = new Set(\n        props.preSelectedBlockId ? [props.preSelectedBlockId] : [],\n      );\n    }\n  },\n);\n\nfunction toggleBlock(blockId: string): void {\n  const newSet = new Set(selectedBlockIds.value);\n  if (newSet.has(blockId)) {\n    newSet.delete(blockId);\n  } else {\n    newSet.add(blockId);\n  }\n  selectedBlockIds.value = newSet;\n}\n\nconst canSave = computed(\n  () =>\n    moduleName.value.trim().length > 0 &&\n    selectedBlockIds.value.size > 0 &&\n    !isSaving.value,\n);\n\nasync function handleSave(): Promise<void> {\n  if (!canSave.value) return;\n\n  isSaving.value = true;\n  error.value = null;\n\n  try {\n    const selectedBlocks = topLevelBlocks.value.filter((b) =>\n      selectedBlockIds.value.has(b.id),\n    );\n    await savedModules.createModule(moduleName.value.trim(), selectedBlocks);\n    emit(\"saved\");\n    emit(\"close\");\n  } catch (err) {\n    error.value = (err as Error).message;\n  } finally {\n    isSaving.value = false;\n  }\n}\n\nfunction handleClose(): void {\n  if (!isSaving.value) {\n    emit(\"close\");\n  }\n}\n\nfunction handleKeydown(event: KeyboardEvent): void {\n  if (event.key === \"Enter\" && !event.shiftKey) {\n    event.preventDefault();\n    handleSave();\n  }\n  if (event.key === \"Escape\") {\n    handleClose();\n  }\n}\n</script>\n\n<template>\n  <TplModal :visible=\"visible\" @close=\"handleClose\" @keydown=\"handleKeydown\">\n    <div\n      role=\"dialog\"\n      aria-modal=\"true\"\n      :aria-busy=\"isSaving\"\n      aria-labelledby=\"tpl-save-module-title\"\n      class=\"tpl-scale-in tpl:mx-4 tpl:w-full tpl:max-w-sm tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5\"\n      style=\"\n        background-color: var(--tpl-bg-elevated);\n        box-shadow: var(--tpl-shadow-xl);\n      \"\n    >\n      <h3\n        id=\"tpl-save-module-title\"\n        class=\"tpl:mb-4 tpl:text-sm tpl:font-semibold tpl:text-[var(--tpl-text)]\"\n      >\n        {{ cloudT.modules.saveAsModule }}\n      </h3>\n\n      <!-- Module name -->\n      <div class=\"tpl:mb-3\">\n        <label\n          class=\"tpl:mb-1.5 tpl:block tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]\"\n        >\n          {{ cloudT.modules.moduleName }}\n        </label>\n        <input\n          v-model=\"moduleName\"\n          type=\"text\"\n          :placeholder=\"cloudT.modules.moduleNamePlaceholder\"\n          class=\"tpl:h-9 tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1 tpl:text-sm tpl:shadow-xs tpl:outline-none tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)] tpl:text-[var(--tpl-text)]\"\n          :disabled=\"isSaving\"\n        />\n      </div>\n\n      <!-- Block selection -->\n      <div class=\"tpl:mb-3\">\n        <label\n          class=\"tpl:mb-1.5 tpl:block tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text-muted)]\"\n        >\n          {{ cloudT.modules.selectBlocks }}\n        </label>\n        <div\n          class=\"tpl:max-h-40 tpl:space-y-1 tpl:overflow-y-auto tpl:rounded-md tpl:border tpl:p-2 tpl:border-[var(--tpl-border)]\"\n        >\n          <label\n            v-for=\"(block, index) in topLevelBlocks\"\n            :key=\"block.id\"\n            class=\"tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-2 tpl:rounded-sm tpl:px-2 tpl:py-1.5 tpl:text-sm tpl:transition-colors tpl:duration-100\"\n            :style=\"{\n              color: 'var(--tpl-text)',\n              backgroundColor: selectedBlockIds.has(block.id)\n                ? 'var(--tpl-primary-light)'\n                : 'transparent',\n            }\"\n          >\n            <input\n              type=\"checkbox\"\n              :checked=\"selectedBlockIds.has(block.id)\"\n              class=\"tpl:accent-[var(--tpl-primary)]\"\n              :disabled=\"isSaving\"\n              @change=\"toggleBlock(block.id)\"\n            />\n            {{ blockLabel(block, index) }}\n          </label>\n        </div>\n      </div>\n\n      <!-- Error message -->\n      <p\n        v-if=\"error\"\n        role=\"alert\"\n        class=\"tpl:mb-3 tpl:text-xs tpl:text-[var(--tpl-danger)]\"\n      >\n        {{ error }}\n      </p>\n\n      <!-- Actions -->\n      <div class=\"tpl:flex tpl:justify-end tpl:gap-2\">\n        <button\n          type=\"button\"\n          class=\"tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:border-[var(--tpl-border)] tpl:text-[var(--tpl-text)] tpl:bg-[var(--tpl-bg)]\"\n          :disabled=\"isSaving\"\n          :class=\"{\n            'tpl:cursor-not-allowed tpl:opacity-50': isSaving,\n          }\"\n          @click=\"handleClose\"\n        >\n          {{ cloudT.modules.cancel }}\n        </button>\n        <button\n          type=\"button\"\n          class=\"tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:hover:opacity-90 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50 tpl:bg-[var(--tpl-primary)] tpl:text-[var(--tpl-bg)]\"\n          :disabled=\"!canSave\"\n          @click=\"handleSave\"\n        >\n          <span v-if=\"isSaving\" class=\"tpl:flex tpl:items-center tpl:gap-1.5\">\n            <LoaderCircle\n              class=\"tpl:animate-spin\"\n              :size=\"12\"\n              :stroke-width=\"2\"\n            />\n            {{ cloudT.modules.saving }}\n          </span>\n          <span v-else>\n            {{ cloudT.modules.save }}\n          </span>\n        </button>\n      </div>\n    </div>\n  </TplModal>\n</template>\n"],"mappings":"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"}

package/dist/cdn/chunks/TitleEditor-Cqw2jvuc.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TitleEditor-Cqw2jvuc.js","names":[],"sources":["../../../src/components/blocks/TitleEditor.vue","../../../src/components/blocks/TitleEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useI18n } from \"../../composables\";\nimport { useRichTextEditor } from \"../../composables/useRichTextEditor\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { TitleBlock as TitleBlockType } from \"@templatical/types\";\nimport {\n  Bold,\n  Braces,\n  Italic,\n  Link,\n  LoaderCircle,\n  ScanLine,\n} from \"@lucide/vue\";\nimport { computed, inject } from \"vue\";\nimport {\n  THEME_STYLES_KEY,\n  UI_THEME_KEY,\n  MERGE_TAG_PICKER_KEY,\n  LOGIC_TAG_PICKER_KEY,\n} from \"../../keys\";\nimport RichTextLinkDialog from \"./RichTextLinkDialog.vue\";\nimport RichTextEditorContent from \"./RichTextEditorContent.vue\";\nimport { withLinkColor } from \"../../utils/linkColorExtension\";\n\nconst props = defineProps<{\n  block: TitleBlockType;\n  toolbarPosition: { top: number; left: number };\n}>();\n\nconst emit = defineEmits<{\n  (e: \"done\"): void;\n}>();\n\nconst themeStyles = inject(THEME_STYLES_KEY, null);\nconst tplUiTheme = inject(UI_THEME_KEY, null);\nconst popoverRoot = usePopoverRoot();\n// Hide the floating toolbar while either built-in picker modal is open — see\n// ParagraphToolbar.vue for the same rationale.\nconst picker = inject(MERGE_TAG_PICKER_KEY, null);\nconst logicPicker = inject(LOGIC_TAG_PICKER_KEY, null);\nconst pickerIsOpen = computed(\n  () => (picker?.isOpen.value ?? false) || (logicPicker?.isOpen.value ?? false),\n);\n\nconst { t } = useI18n();\n\nconst {\n  editor,\n  EditorContent,\n  isLoading,\n  initError,\n  retry,\n  showLinkDialog,\n  linkUrl,\n  linkColor,\n  linkDialogRef,\n  canRequestMergeTag,\n  canInsertLogicTag,\n  openLinkDialog,\n  insertLink,\n  removeLink,\n  closeLinkDialog,\n  handleLinkKeydown,\n  handleAddMergeTag,\n  handleAddLogicTag,\n} = useRichTextEditor({\n  blockId: () => props.block.id,\n  blockContent: () => props.block.content,\n  onDone: () => emit(\"done\"),\n  editorName: \"TitleEditor\",\n  async loadExtensions({\n    mergeTags,\n    syntax,\n    triggerChar,\n    autocompleteEnabled,\n    suggestionEmptyText,\n  }) {\n    const [\n      { Editor: TiptapEditor, EditorContent: EC },\n      { default: StarterKit },\n      { default: LinkExt },\n      { MergeTagNode, MergeTagSuggestion, LogicMergeTagNode },\n    ] = await Promise.all([\n      import(\"@tiptap/vue-3\"),\n      import(\"@tiptap/starter-kit\"),\n      import(\"@tiptap/extension-link\"),\n      import(\"../../extensions\"),\n    ]);\n\n    return {\n      TiptapEditor,\n      EC,\n      extensions: [\n        StarterKit.configure({\n          heading: false,\n          codeBlock: false,\n          blockquote: false,\n          horizontalRule: false,\n          bulletList: false,\n          orderedList: false,\n          listItem: false,\n          strike: false,\n          // StarterKit bundles @tiptap/extension-link (openOnClick: true).\n          // Disable it so the LinkExt below (openOnClick: false) is the only\n          // link extension — otherwise clicking a link while editing opens it.\n          link: false,\n        }),\n        withLinkColor(LinkExt).configure({\n          openOnClick: false,\n          HTMLAttributes: {\n            target: \"_blank\",\n            rel: \"noopener noreferrer\",\n          },\n        }),\n        MergeTagNode.configure({ mergeTags, syntax }),\n        LogicMergeTagNode.configure({ syntax }),\n        ...(autocompleteEnabled && triggerChar && mergeTags.length > 0\n          ? [\n              MergeTagSuggestion.configure({\n                mergeTags,\n                char: triggerChar,\n                emptyText: suggestionEmptyText,\n                popoverRoot,\n              }),\n            ]\n          : []),\n      ],\n    };\n  },\n});\n</script>\n\n<template>\n  <div class=\"tpl-text-editor-wrapper tpl:relative\">\n    <Teleport v-if=\"popoverRoot && !pickerIsOpen\" :to=\"popoverRoot\">\n      <div\n        :data-tpl-theme=\"tplUiTheme\"\n        role=\"toolbar\"\n        :aria-label=\"t.titleEditor.toolbar\"\n        class=\"tpl tpl-text-toolbar tpl:fixed tpl:z-popover tpl:flex tpl:items-center 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\"\n        :style=\"{\n          ...themeStyles,\n          top: `${toolbarPosition.top}px`,\n          left: `${toolbarPosition.left}px`,\n          transform: 'translateY(-100%)',\n        }\"\n      >\n        <template v-if=\"!isLoading && editor\">\n          <!-- Bold -->\n          <button\n            type=\"button\"\n            class=\"tpl-text-toolbar-btn\"\n            :class=\"{\n              'tpl-text-toolbar-btn--active': editor?.isActive('bold'),\n            }\"\n            :aria-label=\"t.titleEditor.bold\"\n            :title=\"t.titleEditor.bold\"\n            @click=\"editor?.chain().focus().toggleBold().run()\"\n          >\n            <Bold :size=\"16\" :stroke-width=\"2.5\" />\n          </button>\n          <!-- Italic -->\n          <button\n            type=\"button\"\n            class=\"tpl-text-toolbar-btn\"\n            :class=\"{\n              'tpl-text-toolbar-btn--active': editor?.isActive('italic'),\n            }\"\n            :aria-label=\"t.titleEditor.italic\"\n            :title=\"t.titleEditor.italic\"\n            @click=\"editor?.chain().focus().toggleItalic().run()\"\n          >\n            <Italic :size=\"16\" :stroke-width=\"2\" />\n          </button>\n          <span\n            class=\"tpl:mx-1.5 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n            aria-hidden=\"true\"\n          ></span>\n          <!-- Link -->\n          <button\n            type=\"button\"\n            class=\"tpl-text-toolbar-btn\"\n            :class=\"{\n              'tpl-text-toolbar-btn--active': editor?.isActive('link'),\n            }\"\n            :aria-label=\"t.titleEditor.addLink\"\n            :title=\"t.titleEditor.addLink\"\n            @click=\"openLinkDialog\"\n          >\n            <Link :size=\"16\" :stroke-width=\"2\" />\n          </button>\n          <!-- Add Merge Tag -->\n          <span\n            v-if=\"canRequestMergeTag\"\n            class=\"tpl:mx-1.5 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n          ></span>\n          <button\n            v-if=\"canRequestMergeTag\"\n            type=\"button\"\n            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)]\"\n            :aria-label=\"t.mergeTag.insert\"\n            :title=\"t.mergeTag.insert\"\n            @click=\"handleAddMergeTag\"\n          >\n            <ScanLine :size=\"16\" :stroke-width=\"2\" />\n            {{ t.mergeTag.insertShort }}\n          </button>\n          <!-- Insert Logic -->\n          <span\n            v-if=\"canInsertLogicTag\"\n            class=\"tpl:mx-1.5 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n          ></span>\n          <button\n            v-if=\"canInsertLogicTag\"\n            type=\"button\"\n            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)]\"\n            :aria-label=\"t.logicTag.insert\"\n            :title=\"t.logicTag.insert\"\n            data-testid=\"insert-logic-button\"\n            @click=\"handleAddLogicTag\"\n          >\n            <Braces :size=\"16\" :stroke-width=\"2\" />\n            {{ t.logicTag.insertShort }}\n          </button>\n        </template>\n        <template v-else>\n          <div\n            class=\"tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n          >\n            <LoaderCircle class=\"tpl-spinner\" :size=\"14\" :stroke-width=\"2\" />\n            {{ t.errors.editorLoading }}\n          </div>\n        </template>\n      </div>\n    </Teleport>\n\n    <RichTextEditorContent\n      :editor=\"editor\"\n      :editor-content=\"EditorContent\"\n      :is-loading=\"isLoading\"\n      :init-error=\"initError\"\n      @retry=\"retry\"\n    />\n\n    <RichTextLinkDialog\n      :visible=\"showLinkDialog\"\n      :is-editing-link=\"editor?.isActive('link') ?? false\"\n      v-model:dialog-ref=\"linkDialogRef\"\n      v-model:link-url=\"linkUrl\"\n      v-model:link-color=\"linkColor\"\n      @close=\"closeLinkDialog\"\n      @insert=\"insertLink\"\n      @remove=\"removeLink\"\n      @keydown=\"handleLinkKeydown\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { useI18n } from \"../../composables\";\nimport { useRichTextEditor } from \"../../composables/useRichTextEditor\";\nimport { usePopoverRoot } from \"../../composables/usePopoverRoot\";\nimport type { TitleBlock as TitleBlockType } from \"@templatical/types\";\nimport {\n  Bold,\n  Braces,\n  Italic,\n  Link,\n  LoaderCircle,\n  ScanLine,\n} from \"@lucide/vue\";\nimport { computed, inject } from \"vue\";\nimport {\n  THEME_STYLES_KEY,\n  UI_THEME_KEY,\n  MERGE_TAG_PICKER_KEY,\n  LOGIC_TAG_PICKER_KEY,\n} from \"../../keys\";\nimport RichTextLinkDialog from \"./RichTextLinkDialog.vue\";\nimport RichTextEditorContent from \"./RichTextEditorContent.vue\";\nimport { withLinkColor } from \"../../utils/linkColorExtension\";\n\nconst props = defineProps<{\n  block: TitleBlockType;\n  toolbarPosition: { top: number; left: number };\n}>();\n\nconst emit = defineEmits<{\n  (e: \"done\"): void;\n}>();\n\nconst themeStyles = inject(THEME_STYLES_KEY, null);\nconst tplUiTheme = inject(UI_THEME_KEY, null);\nconst popoverRoot = usePopoverRoot();\n// Hide the floating toolbar while either built-in picker modal is open — see\n// ParagraphToolbar.vue for the same rationale.\nconst picker = inject(MERGE_TAG_PICKER_KEY, null);\nconst logicPicker = inject(LOGIC_TAG_PICKER_KEY, null);\nconst pickerIsOpen = computed(\n  () => (picker?.isOpen.value ?? false) || (logicPicker?.isOpen.value ?? false),\n);\n\nconst { t } = useI18n();\n\nconst {\n  editor,\n  EditorContent,\n  isLoading,\n  initError,\n  retry,\n  showLinkDialog,\n  linkUrl,\n  linkColor,\n  linkDialogRef,\n  canRequestMergeTag,\n  canInsertLogicTag,\n  openLinkDialog,\n  insertLink,\n  removeLink,\n  closeLinkDialog,\n  handleLinkKeydown,\n  handleAddMergeTag,\n  handleAddLogicTag,\n} = useRichTextEditor({\n  blockId: () => props.block.id,\n  blockContent: () => props.block.content,\n  onDone: () => emit(\"done\"),\n  editorName: \"TitleEditor\",\n  async loadExtensions({\n    mergeTags,\n    syntax,\n    triggerChar,\n    autocompleteEnabled,\n    suggestionEmptyText,\n  }) {\n    const [\n      { Editor: TiptapEditor, EditorContent: EC },\n      { default: StarterKit },\n      { default: LinkExt },\n      { MergeTagNode, MergeTagSuggestion, LogicMergeTagNode },\n    ] = await Promise.all([\n      import(\"@tiptap/vue-3\"),\n      import(\"@tiptap/starter-kit\"),\n      import(\"@tiptap/extension-link\"),\n      import(\"../../extensions\"),\n    ]);\n\n    return {\n      TiptapEditor,\n      EC,\n      extensions: [\n        StarterKit.configure({\n          heading: false,\n          codeBlock: false,\n          blockquote: false,\n          horizontalRule: false,\n          bulletList: false,\n          orderedList: false,\n          listItem: false,\n          strike: false,\n          // StarterKit bundles @tiptap/extension-link (openOnClick: true).\n          // Disable it so the LinkExt below (openOnClick: false) is the only\n          // link extension — otherwise clicking a link while editing opens it.\n          link: false,\n        }),\n        withLinkColor(LinkExt).configure({\n          openOnClick: false,\n          HTMLAttributes: {\n            target: \"_blank\",\n            rel: \"noopener noreferrer\",\n          },\n        }),\n        MergeTagNode.configure({ mergeTags, syntax }),\n        LogicMergeTagNode.configure({ syntax }),\n        ...(autocompleteEnabled && triggerChar && mergeTags.length > 0\n          ? [\n              MergeTagSuggestion.configure({\n                mergeTags,\n                char: triggerChar,\n                emptyText: suggestionEmptyText,\n                popoverRoot,\n              }),\n            ]\n          : []),\n      ],\n    };\n  },\n});\n</script>\n\n<template>\n  <div class=\"tpl-text-editor-wrapper tpl:relative\">\n    <Teleport v-if=\"popoverRoot && !pickerIsOpen\" :to=\"popoverRoot\">\n      <div\n        :data-tpl-theme=\"tplUiTheme\"\n        role=\"toolbar\"\n        :aria-label=\"t.titleEditor.toolbar\"\n        class=\"tpl tpl-text-toolbar tpl:fixed tpl:z-popover tpl:flex tpl:items-center 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\"\n        :style=\"{\n          ...themeStyles,\n          top: `${toolbarPosition.top}px`,\n          left: `${toolbarPosition.left}px`,\n          transform: 'translateY(-100%)',\n        }\"\n      >\n        <template v-if=\"!isLoading && editor\">\n          <!-- Bold -->\n          <button\n            type=\"button\"\n            class=\"tpl-text-toolbar-btn\"\n            :class=\"{\n              'tpl-text-toolbar-btn--active': editor?.isActive('bold'),\n            }\"\n            :aria-label=\"t.titleEditor.bold\"\n            :title=\"t.titleEditor.bold\"\n            @click=\"editor?.chain().focus().toggleBold().run()\"\n          >\n            <Bold :size=\"16\" :stroke-width=\"2.5\" />\n          </button>\n          <!-- Italic -->\n          <button\n            type=\"button\"\n            class=\"tpl-text-toolbar-btn\"\n            :class=\"{\n              'tpl-text-toolbar-btn--active': editor?.isActive('italic'),\n            }\"\n            :aria-label=\"t.titleEditor.italic\"\n            :title=\"t.titleEditor.italic\"\n            @click=\"editor?.chain().focus().toggleItalic().run()\"\n          >\n            <Italic :size=\"16\" :stroke-width=\"2\" />\n          </button>\n          <span\n            class=\"tpl:mx-1.5 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n            aria-hidden=\"true\"\n          ></span>\n          <!-- Link -->\n          <button\n            type=\"button\"\n            class=\"tpl-text-toolbar-btn\"\n            :class=\"{\n              'tpl-text-toolbar-btn--active': editor?.isActive('link'),\n            }\"\n            :aria-label=\"t.titleEditor.addLink\"\n            :title=\"t.titleEditor.addLink\"\n            @click=\"openLinkDialog\"\n          >\n            <Link :size=\"16\" :stroke-width=\"2\" />\n          </button>\n          <!-- Add Merge Tag -->\n          <span\n            v-if=\"canRequestMergeTag\"\n            class=\"tpl:mx-1.5 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n          ></span>\n          <button\n            v-if=\"canRequestMergeTag\"\n            type=\"button\"\n            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)]\"\n            :aria-label=\"t.mergeTag.insert\"\n            :title=\"t.mergeTag.insert\"\n            @click=\"handleAddMergeTag\"\n          >\n            <ScanLine :size=\"16\" :stroke-width=\"2\" />\n            {{ t.mergeTag.insertShort }}\n          </button>\n          <!-- Insert Logic -->\n          <span\n            v-if=\"canInsertLogicTag\"\n            class=\"tpl:mx-1.5 tpl:h-6 tpl:w-px tpl:bg-[var(--tpl-border)]\"\n          ></span>\n          <button\n            v-if=\"canInsertLogicTag\"\n            type=\"button\"\n            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)]\"\n            :aria-label=\"t.logicTag.insert\"\n            :title=\"t.logicTag.insert\"\n            data-testid=\"insert-logic-button\"\n            @click=\"handleAddLogicTag\"\n          >\n            <Braces :size=\"16\" :stroke-width=\"2\" />\n            {{ t.logicTag.insertShort }}\n          </button>\n        </template>\n        <template v-else>\n          <div\n            class=\"tpl:flex tpl:items-center tpl:gap-2 tpl:px-2 tpl:text-xs tpl:text-[var(--tpl-text-dim)]\"\n          >\n            <LoaderCircle class=\"tpl-spinner\" :size=\"14\" :stroke-width=\"2\" />\n            {{ t.errors.editorLoading }}\n          </div>\n        </template>\n      </div>\n    </Teleport>\n\n    <RichTextEditorContent\n      :editor=\"editor\"\n      :editor-content=\"EditorContent\"\n      :is-loading=\"isLoading\"\n      :init-error=\"initError\"\n      @retry=\"retry\"\n    />\n\n    <RichTextLinkDialog\n      :visible=\"showLinkDialog\"\n      :is-editing-link=\"editor?.isActive('link') ?? false\"\n      v-model:dialog-ref=\"linkDialogRef\"\n      v-model:link-url=\"linkUrl\"\n      v-model:link-color=\"linkColor\"\n      @close=\"closeLinkDialog\"\n      @insert=\"insertLink\"\n      @remove=\"removeLink\"\n      @keydown=\"handleLinkKeydown\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}