@templatical/editor 0.0.6 → 0.1.1

package/LICENSE

@@ -0,0 +1,56 @@
+Functional Source License, Version 1.1, MIT Future License
+
+Copyright (c) 2026-present Templatical
+
+## Terms and Conditions
+
+### Licensor ("We")
+
+Templatical
+
+### The Software
+
+Templatical Email Editor — the visual drag-and-drop email template editor
+(@templatical/core, @templatical/editor, and @templatical/media-library
+packages).
+
+### Grant of Rights
+
+Subject to the terms and conditions of this License, We hereby grant You a
+non-exclusive, worldwide, non-transferable license to use, copy, modify,
+create derivative works, and redistribute the Software, subject to the
+following conditions:
+
+### Permitted Uses
+
+You may use the Software for any purpose, including commercial purposes,
+**provided that** you do not offer the Software, or a substantially similar
+product built using the Software, as a hosted or managed service that
+competes with Templatical's commercial offerings.
+
+### Change Date
+
+Two (2) years from the date of each release of the Software.
+
+### Change License
+
+MIT License
+
+On the Change Date, the above copyright notice and this permission notice
+shall be replaced with the MIT License, and the Software will be available
+under the MIT License for all purposes without restriction.
+
+### Notices
+
+You must retain this license notice in all copies or substantial portions
+of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+
+---
+
+Note: The @templatical/types, @templatical/renderer, and
+@templatical/import-beefree packages are licensed separately under the MIT
+License. See LICENSE-MIT for those packages' terms.

package/README.md

@@ -0,0 +1,69 @@
+# @templatical/editor
+
+> Vue 3 visual drag-and-drop email editor — drop into any web app with one function call.
+
+[![npm version](https://img.shields.io/npm/v/@templatical/editor?label=npm&color=cb3837)](https://www.npmjs.com/package/@templatical/editor)
+[![License](https://img.shields.io/badge/license-FSL--1.1--MIT-blue)](https://github.com/templatical/sdk/blob/main/LICENSE)
+
+The visual editor for [Templatical](https://github.com/templatical/sdk) — an open-source drag-and-drop email editor with JSON templates and MJML output.
+
+- 🧩 **14 block types** — title, paragraph, image, button, section, divider, spacer, social icons, menu, table, HTML, video, countdown, custom
+- 🎨 **27 design tokens** — full theming, dark mode, custom fonts
+- 🔌 **Framework-agnostic** — works in React, Vue, Svelte, Angular, vanilla
+- 📦 **JSON in, MJML out** — portable templates, render with any email provider
+- 🌍 **Bilingual** — English + German built in
+- 🔒 **TypeScript strict** — full type safety end to end
+
+## Install
+
+Install the editor alongside `@templatical/renderer` — the renderer is what enables `editor.toMjml()` (the editor auto-detects it at runtime).
+
+```bash
+npm install @templatical/editor @templatical/renderer
+```
+
+## Usage
+
+```ts
+import { init } from '@templatical/editor';
+import '@templatical/editor/style.css';
+
+const editor = await init({
+  container: '#editor',
+  onChange(content) {
+    // content is JSON — store/version/sync however you want
+  },
+});
+
+// Render to MJML when sending email
+const mjml = editor.toMjml();
+
+// Always unmount when removing the editor (cleans up listeners + DOM)
+editor.unmount();
+```
+
+```html
+<div id="editor" style="height: 100vh"></div>
+```
+
+## Framework integration
+
+First-class examples for **React, Vue, Svelte, Angular, and vanilla JS** are in the [installation guide](https://docs.templatical.com/getting-started/installation).
+
+## Cloud features
+
+For AI rewrite, real-time collaboration, comments, snapshots, and saved modules, use `initCloud()` instead. See the [Cloud guide](https://docs.templatical.com/cloud/getting-started).
+
+## Documentation
+
+- [Quick Start](https://docs.templatical.com/getting-started/quick-start)
+- [Editor API reference](https://docs.templatical.com/api/editor)
+- [Block reference](https://docs.templatical.com/guide/blocks)
+- [Theming](https://docs.templatical.com/guide/theming)
+- [Custom blocks](https://docs.templatical.com/guide/custom-blocks)
+
+Full docs at **[docs.templatical.com](https://docs.templatical.com)**.
+
+## License
+
+[FSL-1.1-MIT](https://github.com/templatical/sdk/blob/main/LICENSE) — free for any non-competing commercial use, automatically converts to MIT after 2 years per release. [License FAQ](https://docs.templatical.com/license-faq).

package/dist/{AiChatSidebar-CNhSl_ty.js → AiChatSidebar-DgAjDWO1.js}

@@ -1,22 +1,22 @@
-import { o as e, s as t } from "./dist-Ac4o1O4a.js";
-import { C as n, T as r, f as ee, g as te, r as ne } from "./keys-C0MQRs8d.js";
-import { n as i, t as a } from "./_plugin-vue_export-helper-5TQrnOhO.js";
-import { t as re } from "./circle-alert-CVTmJHKW.js";
-import { t as ie } from "./loader-circle-DilFjHSk.js";
-import { t as ae } from "./send-ChDw64yL.js";
-import { t as o } from "./sparkles-Co9fkDcv.js";
-import { t as oe } from "./trash-2-CZkMtjeC.js";
-import { t as s } from "./x-CU2XZOkQ.js";
-import { t as se } from "./LoadingTrack--aUassFH.js";
-import { Fragment as c, Transition as ce, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as p, createVNode as m, defineComponent as h, inject as le, nextTick as ue, normalizeClass as de, onBeforeUnmount as g, openBlock as _, ref as v, renderList as y, toDisplayString as b, unref as x, vModelText as fe, watch as S, withCtx as pe, withDirectives as C } from "vue";
-import { useAiChat as w } from "@templatical/core/cloud";
-var T = i("redo-2", [["path", {
+import { Ct as e, E as t, H as n, M as r, O as i, Ot as a, P as o, S as s, V as ee, Y as c, _ as l, b as u, d, g as f, h as p, k as m, m as h, s as te, t as ne, tt as g, y as _, z as v } from "./vue.runtime.esm-bundler-DryoQb-v.js";
+import { o as re, s as ie } from "./dist-n0PkFNGl.js";
+import { C as ae, T as y, f as oe, g as se, r as ce } from "./keys-CIw9mUI2.js";
+import { n as b, t as x } from "./_plugin-vue_export-helper-OO6pH1Dh.js";
+import { t as le } from "./circle-alert-Dpr8MgkR.js";
+import { t as ue } from "./loader-circle-BYeKJ3to.js";
+import { t as de } from "./send-CJPSzbLO.js";
+import { t as S } from "./sparkles-DT_27AYs.js";
+import { t as fe } from "./trash-2-BY-xp5hg.js";
+import { t as pe } from "./x-D-7GkO6Z.js";
+import { t as me } from "./LoadingTrack-Cdz2SSq9.js";
+import { useAiChat as C } from "@templatical/core/cloud";
+var w = b("redo-2", [["path", {
 	d: "m15 14 5-5-5-5",
 	key: "12vg1m"
 }], ["path", {
 	d: "M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13",
 	key: "6uklza"
-}]]), E = i("undo-2", [["path", {
+}]]), T = b("undo-2", [["path", {
 	d: "M9 14 4 9l5-5",
 	key: "102s5s"
 }], ["path", {
@@ -25,27 +25,27 @@ var T = i("redo-2", [["path", {
 }]]);
 //#endregion
 //#region src/composables/useAliveFlag.ts
-function D() {
+function E() {
 	let e = { alive: !0 };
-	return g(() => {
+	return m(() => {
 		e.alive = !1;
 	}), e;
 }
 //#endregion
 //#region src/cloud/components/AiChatSidebar.vue?vue&type=script&setup=true&lang.ts
-var O = {
+var D = {
 	key: 0,
 	class: "tpl-ai-sidebar tpl:absolute tpl:top-14 tpl:right-0 tpl:bottom-0 tpl:z-panel tpl:flex tpl:w-[360px] tpl:flex-col tpl:border-l tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg-elevated)]"
-}, k = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3" }, A = { class: "tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-primary)]" }, j = { class: "tpl:flex tpl:items-center tpl:gap-1" }, M = ["title"], N = { class: "tpl:relative tpl:flex tpl:min-h-0 tpl:flex-1 tpl:flex-col" }, P = {
+}, O = { class: "tpl:flex tpl:items-center tpl:justify-between tpl:border-b tpl:border-[var(--tpl-border)] tpl:px-4 tpl:py-3" }, k = { class: "tpl:flex tpl:items-center tpl:gap-1.5 tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-primary)]" }, A = { class: "tpl:flex tpl:items-center tpl:gap-1" }, j = ["title"], M = { class: "tpl:relative tpl:flex tpl:min-h-0 tpl:flex-1 tpl:flex-col" }, N = {
 	key: 0,
 	class: "tpl:flex tpl:h-full tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-3 tpl:text-center"
-}, F = { class: "tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, I = {
+}, P = { class: "tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, F = {
 	key: 1,
 	class: "tpl:flex tpl:h-full tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-3 tpl:text-center"
-}, L = { class: "tpl:max-w-[240px] tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, R = {
+}, I = { class: "tpl:max-w-[240px] tpl:text-sm tpl:text-[var(--tpl-text-muted)]" }, L = {
 	key: 2,
 	class: "tpl:flex tpl:flex-col tpl:gap-4"
-}, z = {
+}, R = {
 	key: 0,
 	class: "tpl:self-end tpl:rounded-[var(--tpl-radius-sm)] tpl:px-3.5 tpl:py-2.5 tpl:text-sm",
 	style: {
@@ -54,10 +54,10 @@ var O = {
 		"max-width": "85%",
 		"box-shadow": "var(--tpl-shadow)"
 	}
-}, B = {
+}, z = {
 	key: 1,
 	class: "tpl:flex tpl:flex-col tpl:gap-2"
-}, me = {
+}, B = {
 	key: 1,
 	class: "tpl:rounded-[var(--tpl-radius-sm)] tpl:px-3.5 tpl:py-2.5 tpl:text-sm tpl:whitespace-pre-wrap",
 	style: {
@@ -80,24 +80,24 @@ var O = {
 		"background-color": "color-mix(\n              in srgb,\n              var(--tpl-bg) 50%,\n              transparent\n            )",
 		"backdrop-filter": "blur(2px)"
 	}
-}, _e = { class: "tpl:flex tpl:flex-col tpl:gap-1.5" }, ve = ["onClick"], ye = { class: "tpl:border-t tpl:p-3 tpl:border-[var(--tpl-border)]" }, be = { class: "tpl-ai-input-wrapper tpl:flex tpl:items-end tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:border tpl:px-3 tpl:py-2 tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]" }, xe = ["placeholder", "disabled"], Se = ["disabled"], Ce = { class: "tpl:m-0 tpl:px-1 tpl:pt-2 tpl:text-center tpl:text-[11px] tpl:text-[var(--tpl-text-dim)]" }, V = /* @__PURE__ */ a(/* @__PURE__ */ h({
+}, _e = { class: "tpl:flex tpl:flex-col tpl:gap-1.5" }, ve = ["onClick"], ye = { class: "tpl:border-t tpl:p-3 tpl:border-[var(--tpl-border)]" }, be = { class: "tpl-ai-input-wrapper tpl:flex tpl:items-end tpl:gap-2 tpl:rounded-[var(--tpl-radius)] tpl:border tpl:px-3 tpl:py-2 tpl:border-[var(--tpl-border)] tpl:bg-[var(--tpl-bg)]" }, xe = ["placeholder", "disabled"], Se = ["disabled"], Ce = { class: "tpl:m-0 tpl:px-1 tpl:pt-2 tpl:text-center tpl:text-[11px] tpl:text-[var(--tpl-text-dim)]" }, V = /* @__PURE__ */ x(/* @__PURE__ */ s({
 	__name: "AiChatSidebar",
 	props: {
 		visible: { type: Boolean },
 		onApply: { type: Function }
 	},
 	emits: ["close"],
-	setup(i, { emit: a }) {
-		let h = i, g = a, V = r(n, "AiChatSidebar"), H = r(ee, "AiChatSidebar"), we = r(ne, "AiChatSidebar"), U = le(te, []), W = D(), G = w({
+	setup(s, { emit: m }) {
+		let b = s, x = m, V = y(ae, "AiChatSidebar"), H = y(oe, "AiChatSidebar"), we = y(ce, "AiChatSidebar"), U = t(se, []), W = E(), G = C({
 			authManager: we,
 			getTemplateId: () => H.state.template?.id ?? null,
-			onApply: h.onApply,
+			onApply: b.onApply,
 			onError: void 0
-		}), K = v(""), q = v(null), J = v(!1), Y = v(0), { pause: X, resume: Te } = e(() => {
+		}), K = c(""), q = c(null), J = c(!1), Y = c(0), { pause: X, resume: Te } = re(() => {
 			let e = G.suggestions.value?.length ?? 0;
 			Y.value < e ? Y.value++ : X();
-		}, 150, { immediate: !1 }), { start: Ee } = t(() => Te(), 100, { immediate: !1 });
-		S(() => G.suggestions.value?.length ?? 0, (e) => {
+		}, 150, { immediate: !1 }), { start: Ee } = ie(() => Te(), 100, { immediate: !1 });
+		v(() => G.suggestions.value?.length ?? 0, (e) => {
 			if (X(), e === 0) {
 				Y.value = 0;
 				return;
@@ -105,11 +105,11 @@ var O = {
 			Y.value = 0, Ee();
 		});
 		function Z() {
-			ue(() => {
+			i(() => {
 				q.value && (q.value.scrollTop = q.value.scrollHeight);
 			});
 		}
-		S(() => G.messages.value?.length ?? 0, () => Z()), S(() => h.visible, async (e) => {
+		v(() => G.messages.value?.length ?? 0, () => Z()), v(() => b.visible, async (e) => {
 			if (e && !J.value) {
 				if (J.value = !0, await G.loadConversation(), !W.alive) return;
 				(G.messages.value?.length ?? 0) === 0 && H.content.value.blocks.length === 0 && G.loadSuggestions(H.content.value, U);
@@ -128,7 +128,7 @@ var O = {
 		function Oe(e) {
 			e.key === "Enter" && !e.shiftKey && (e.preventDefault(), Q());
 		}
-		return (e, t) => (_(), l(ce, {
+		return (t, i) => (r(), p(ne, {
 			"enter-active-class": "tpl-ai-slide-enter-active",
 			"enter-from-class": "tpl:translate-x-full",
 			"enter-to-class": "tpl:translate-x-0",
@@ -136,42 +136,42 @@ var O = {
 			"leave-from-class": "tpl:translate-x-0",
 			"leave-to-class": "tpl:translate-x-full"
 		}, {
-			default: pe(() => [i.visible ? (_(), d("div", O, [
-				f("div", k, [f("div", A, [m(x(o), {
+			default: ee(() => [s.visible ? (r(), l("div", D, [
+				h("div", O, [h("div", k, [u(g(S), {
 					size: 13,
 					"stroke-width": 2
-				}), f("span", null, b(x(V).aiChat.title), 1)]), f("div", j, [(x(G).messages.value?.length ?? 0) > 0 ? (_(), d("button", {
+				}), h("span", null, a(g(V).aiChat.title), 1)]), h("div", A, [(g(G).messages.value?.length ?? 0) > 0 ? (r(), l("button", {
 					key: 0,
 					class: "tpl:rounded-md tpl:p-0.5 tpl:transition-colors tpl:duration-150 tpl:text-[var(--tpl-text-muted)]",
-					title: x(V).aiChat.clear,
-					onClick: t[0] ||= (e) => x(G).clearChat()
-				}, [m(x(oe), {
+					title: g(V).aiChat.clear,
+					onClick: i[0] ||= (e) => g(G).clearChat()
+				}, [u(g(fe), {
 					size: 14,
 					"stroke-width": 2
-				})], 8, M)) : u("", !0), f("button", {
+				})], 8, j)) : f("", !0), h("button", {
 					class: "tpl:rounded-md tpl:p-0.5 tpl:transition-colors tpl:duration-150 tpl:text-[var(--tpl-text-muted)]",
-					onClick: t[1] ||= (e) => g("close")
-				}, [m(x(s), {
+					onClick: i[1] ||= (e) => x("close")
+				}, [u(g(pe), {
 					size: 14,
 					"stroke-width": 2
 				})])])]),
-				f("div", N, [
-					f("div", {
+				h("div", M, [
+					h("div", {
 						ref_key: "messagesContainer",
 						ref: q,
 						class: "tpl:flex-1 tpl:overflow-y-auto tpl:p-4"
-					}, [x(G).isLoadingHistory.value ? (_(), d("div", P, [m(x(ie), {
+					}, [g(G).isLoadingHistory.value ? (r(), l("div", N, [u(g(ue), {
 						class: "tpl-spinner tpl:text-[var(--tpl-text-muted)]",
 						size: 24,
 						"stroke-width": 2
-					}), f("p", F, b(x(V).aiChat.loadingHistory), 1)])) : (x(G).messages.value?.length ?? 0) === 0 ? (_(), d("div", I, [m(x(o), {
+					}), h("p", P, a(g(V).aiChat.loadingHistory), 1)])) : (g(G).messages.value?.length ?? 0) === 0 ? (r(), l("div", F, [u(g(S), {
 						size: 32,
 						"stroke-width": 1.5,
 						class: "tpl:text-[var(--tpl-text-dim)]"
-					}), f("p", L, b(x(V).aiChat.placeholder), 1)])) : (_(), d("div", R, [(_(!0), d(c, null, y(x(G).messages.value, (e, n) => (_(), d("div", {
+					}), h("p", I, a(g(V).aiChat.placeholder), 1)])) : (r(), l("div", L, [(r(!0), l(d, null, o(g(G).messages.value, (e, t) => (r(), l("div", {
 						key: e.id,
 						class: "tpl:flex tpl:flex-col tpl:gap-2"
-					}, [e.role === "user" ? (_(), d("div", z, b(e.content), 1)) : (_(), d("div", B, [!$(e.content) && x(G).isGenerating.value && n === (x(G).messages.value?.length ?? 0) - 1 ? (_(), l(se, { key: 0 })) : (_(), d("div", me, b($(e.content) || x(V).aiChat.applied), 1)), e.id === x(G).lastApplyMessageId.value && !x(G).isGenerating.value ? (_(), d("button", {
+					}, [e.role === "user" ? (r(), l("div", R, a(e.content), 1)) : (r(), l("div", z, [!$(e.content) && g(G).isGenerating.value && t === (g(G).messages.value?.length ?? 0) - 1 ? (r(), p(me, { key: 0 })) : (r(), l("div", B, a($(e.content) || g(V).aiChat.applied), 1)), e.id === g(G).lastApplyMessageId.value && !g(G).isGenerating.value ? (r(), l("button", {
 						key: 2,
 						class: "tpl:inline-flex tpl:items-center tpl:gap-1.5 tpl:self-start tpl:rounded-md tpl:border tpl:px-2.5 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
 						style: {
@@ -179,47 +179,47 @@ var O = {
 							color: "var(--tpl-text-muted)",
 							"background-color": "transparent"
 						},
-						onClick: t[2] ||= (e) => x(G).toggleLastRevert()
-					}, [x(G).isLastChangeReverted.value ? (_(), d(c, { key: 0 }, [m(x(T), {
+						onClick: i[2] ||= (e) => g(G).toggleLastRevert()
+					}, [g(G).isLastChangeReverted.value ? (r(), l(d, { key: 0 }, [u(g(w), {
 						size: 12,
 						"stroke-width": 2
-					}), p(" " + b(x(V).aiChat.reapply), 1)], 64)) : (_(), d(c, { key: 1 }, [m(x(E), {
+					}), _(" " + a(g(V).aiChat.reapply), 1)], 64)) : (r(), l(d, { key: 1 }, [u(g(T), {
 						size: 12,
 						"stroke-width": 2
-					}), p(" " + b(x(V).aiChat.revert), 1)], 64))])) : u("", !0)]))]))), 128))]))], 512),
-					x(G).error.value ? (_(), d("div", he, [m(x(re), {
+					}), _(" " + a(g(V).aiChat.revert), 1)], 64))])) : f("", !0)]))]))), 128))]))], 512),
+					g(G).error.value ? (r(), l("div", he, [u(g(le), {
 						size: 14,
 						"stroke-width": 2,
 						class: "tpl:mt-0.5 tpl:shrink-0"
-					}), f("span", null, b(x(G).error.value === "ai_apply_failed" ? x(V).aiChat.applyFailed : x(V).aiChat.error), 1)])) : u("", !0),
-					(x(G).suggestions.value?.length ?? 0) > 0 ? (_(), d("div", ge, [f("div", _e, [(_(!0), d(c, null, y(x(G).suggestions.value ?? [], (e, t) => (_(), d("button", {
-						key: t,
-						class: de(["tpl-suggestion-btn tpl:cursor-pointer tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:px-3 tpl:py-2 tpl:text-left tpl:text-xs tpl:leading-snug tpl:transition-all tpl:duration-300 tpl:ease-out", (x(G).suggestions.value?.length ?? 0) - 1 - t < Y.value ? "tpl:translate-y-0 tpl:opacity-100" : "tpl:pointer-events-none tpl:-translate-y-2 tpl:opacity-0"]),
+					}), h("span", null, a(g(G).error.value === "ai_apply_failed" ? g(V).aiChat.applyFailed : g(V).aiChat.error), 1)])) : f("", !0),
+					(g(G).suggestions.value?.length ?? 0) > 0 ? (r(), l("div", ge, [h("div", _e, [(r(!0), l(d, null, o(g(G).suggestions.value ?? [], (t, n) => (r(), l("button", {
+						key: n,
+						class: e(["tpl-suggestion-btn tpl:cursor-pointer tpl:rounded-[var(--tpl-radius-sm)] tpl:border tpl:px-3 tpl:py-2 tpl:text-left tpl:text-xs tpl:leading-snug tpl:transition-all tpl:duration-300 tpl:ease-out", (g(G).suggestions.value?.length ?? 0) - 1 - n < Y.value ? "tpl:translate-y-0 tpl:opacity-100" : "tpl:pointer-events-none tpl:-translate-y-2 tpl:opacity-0"]),
 						style: {
 							"border-color": "var(--tpl-border)",
 							color: "var(--tpl-primary)",
 							"background-color": "var(--tpl-bg)",
 							"box-shadow": "var(--tpl-shadow)"
 						},
-						onClick: (t) => De(e)
-					}, b(e), 11, ve))), 128))])])) : u("", !0)
+						onClick: (e) => De(t)
+					}, a(t), 11, ve))), 128))])])) : f("", !0)
 				]),
-				f("div", ye, [f("div", be, [C(f("textarea", {
-					"onUpdate:modelValue": t[3] ||= (e) => K.value = e,
+				h("div", ye, [h("div", be, [n(h("textarea", {
+					"onUpdate:modelValue": i[3] ||= (e) => K.value = e,
 					class: "tpl:max-h-32 tpl:min-h-[64px] tpl:flex-1 tpl:resize-none tpl:border-none tpl:bg-transparent tpl:font-sans tpl:text-sm tpl:outline-none tpl:text-[var(--tpl-text)]",
-					placeholder: x(V).aiChat.inputPlaceholder,
-					disabled: x(G).isGenerating.value,
+					placeholder: g(V).aiChat.inputPlaceholder,
+					disabled: g(G).isGenerating.value,
 					rows: "3",
 					onKeydown: Oe
-				}, null, 40, xe), [[fe, K.value]]), f("button", {
+				}, null, 40, xe), [[te, K.value]]), h("button", {
 					class: "tpl-ai-send-btn tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-center tpl:rounded-md tpl:p-1.5 tpl:transition-all tpl:duration-150 tpl:disabled:opacity-40 tpl:text-[var(--tpl-primary)]",
-					disabled: !K.value.trim() || x(G).isGenerating.value,
+					disabled: !K.value.trim() || g(G).isGenerating.value,
 					onClick: Q
-				}, [m(x(ae), {
+				}, [u(g(de), {
 					size: 16,
 					"stroke-width": 2
-				})], 8, Se)]), f("p", Ce, b(x(V).aiMenu.disclaimer), 1)])
-			])) : u("", !0)]),
+				})], 8, Se)]), h("p", Ce, a(g(V).aiMenu.disclaimer), 1)])
+			])) : f("", !0)]),
 			_: 1
 		}));
 	}

package/dist/{AiFeatureMenu-BFVsjUJY.js → AiFeatureMenu-j6oaiRVi.js}

@@ -1,11 +1,11 @@
-import { T as e, t } from "./keys-C0MQRs8d.js";
-import { t as n } from "./useI18n-D6m7ZUgY.js";
-import "./useEditorCore-ColJh1ST.js";
-import { t as r } from "./_plugin-vue_export-helper-5TQrnOhO.js";
-import { t as i } from "./image-up-vZa1Txr-.js";
-import { t as a } from "./shield-check-9dhLdyST.js";
-import { t as o } from "./sparkles-Co9fkDcv.js";
-import { Fragment as s, computed as c, createBlock as l, createElementBlock as u, createElementVNode as d, defineComponent as f, normalizeStyle as p, openBlock as m, renderList as h, resolveDynamicComponent as g, toDisplayString as _ } from "vue";
+import { L as e, M as t, Ot as n, P as r, S as i, _ as a, d as o, h as s, m as c, p as l, wt as u } from "./vue.runtime.esm-bundler-DryoQb-v.js";
+import { T as d, t as f } from "./keys-CIw9mUI2.js";
+import { t as p } from "./useI18n-B8CN2iWs.js";
+import "./useEditorCore-DMH2QpUL.js";
+import { t as m } from "./_plugin-vue_export-helper-OO6pH1Dh.js";
+import { t as h } from "./image-up-B1AEiHCh.js";
+import { t as g } from "./shield-check-DdEvVYMH.js";
+import { t as _ } from "./sparkles-DT_27AYs.js";
 //#region src/cloud/components/AiFeatureMenu.vue?vue&type=script&setup=true&lang.ts
 var v = {
 	class: "tpl-ai-feature-menu tpl:w-[280px] tpl:overflow-hidden tpl:rounded-[var(--tpl-radius)] tpl:py-1 tpl:bg-[var(--tpl-bg-elevated)] tpl:border tpl:border-[var(--tpl-border)] tpl:shadow-[var(--tpl-shadow-lg)]",
@@ -13,50 +13,50 @@ var v = {
 		"backdrop-filter": "blur(8px)",
 		"-webkit-backdrop-filter": "blur(8px)"
 	}
-}, y = ["onClick"], b = { class: "tpl:flex tpl:min-w-0 tpl:flex-col tpl:gap-0.5" }, x = { class: "tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text)]" }, S = { class: "tpl:text-xs tpl:leading-snug tpl:text-[var(--tpl-text-muted)]" }, C = /* @__PURE__ */ r(/* @__PURE__ */ f({
+}, y = ["onClick"], b = { class: "tpl:flex tpl:min-w-0 tpl:flex-col tpl:gap-0.5" }, x = { class: "tpl:text-sm tpl:font-medium tpl:text-[var(--tpl-text)]" }, S = { class: "tpl:text-xs tpl:leading-snug tpl:text-[var(--tpl-text-muted)]" }, C = /* @__PURE__ */ m(/* @__PURE__ */ i({
 	__name: "AiFeatureMenu",
 	props: { activeFeature: {} },
 	emits: ["select"],
-	setup(r, { emit: f }) {
-		let C = f, { t: w } = n(), T = e(t, "AiFeatureMenu"), E = {
+	setup(i, { emit: m }) {
+		let C = m, { t: w } = p(), T = d(f, "AiFeatureMenu"), E = {
 			"ai-chat": "chat",
 			"design-reference": "designToTemplate",
 			scoring: "scoring"
 		}, D = [
 			{
 				key: "ai-chat",
-				icon: o
+				icon: _
 			},
 			{
 				key: "design-reference",
-				icon: i
+				icon: h
 			},
 			{
 				key: "scoring",
-				icon: a
+				icon: g
 			}
-		], O = c(() => D.filter((e) => T.isFeatureEnabled(E[e.key])));
+		], O = l(() => D.filter((e) => T.isFeatureEnabled(E[e.key])));
 		function k(e) {
 			return e === "ai-chat" ? w.aiMenu.aiAssistant : e === "design-reference" ? w.aiMenu.designToTemplate : w.aiMenu.templateScore;
 		}
 		function A(e) {
 			return e === "ai-chat" ? w.aiMenu.aiAssistantDesc : e === "design-reference" ? w.aiMenu.designToTemplateDesc : w.aiMenu.templateScoreDesc;
 		}
-		return (e, t) => (m(), u("div", v, [(m(!0), u(s, null, h(O.value, (e) => (m(), u("button", {
-			key: e.key,
+		return (l, d) => (t(), a("div", v, [(t(!0), a(o, null, r(O.value, (r) => (t(), a("button", {
+			key: r.key,
 			class: "tpl-ai-feature-menu-item tpl:flex tpl:w-full tpl:cursor-pointer tpl:items-start tpl:gap-3 tpl:border-none tpl:px-3 tpl:py-2.5 tpl:text-left tpl:transition-colors tpl:duration-100",
-			style: p({ backgroundColor: r.activeFeature === e.key ? "var(--tpl-primary-light)" : "transparent" }),
-			onClick: (t) => C("select", e.key)
-		}, [d("div", {
+			style: u({ backgroundColor: i.activeFeature === r.key ? "var(--tpl-primary-light)" : "transparent" }),
+			onClick: (e) => C("select", r.key)
+		}, [c("div", {
 			class: "tpl:mt-0.5 tpl:flex tpl:size-7 tpl:shrink-0 tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-sm)]",
-			style: p({
-				backgroundColor: r.activeFeature === e.key ? "var(--tpl-primary)" : "var(--tpl-bg-active)",
-				color: r.activeFeature === e.key ? "var(--tpl-bg)" : "var(--tpl-text-muted)"
+			style: u({
+				backgroundColor: i.activeFeature === r.key ? "var(--tpl-primary)" : "var(--tpl-bg-active)",
+				color: i.activeFeature === r.key ? "var(--tpl-bg)" : "var(--tpl-text-muted)"
 			})
-		}, [(m(), l(g(e.icon), {
+		}, [(t(), s(e(r.icon), {
 			size: 15,
 			"stroke-width": 2
-		}))], 4), d("div", b, [d("span", x, _(k(e.key)), 1), d("span", S, _(A(e.key)), 1)])], 12, y))), 128))]));
+		}))], 4), c("div", b, [c("span", x, n(k(r.key)), 1), c("span", S, n(A(r.key)), 1)])], 12, y))), 128))]));
 	}
 }), [["__scopeId", "data-v-638e1be2"]]);
 //#endregion