best-email-builder 0.8.0 → 0.10.0

package/dist/ai.js

@@ -1,6 +1,6 @@
 import {
   cleanRichText
-} from "./chunk-P7ABBLX6.js";
+} from "./chunk-KTTVBNOU.js";
 import {
   Button,
   Dialog,
@@ -15,52 +15,43 @@ import {
   DropdownMenuTrigger,
   Input,
   Label,
-  SEARCH_KEYS,
-  SearchKeyHint,
   SectionLabel,
-  Textarea,
   cn,
   createHttpCaller,
-  useSearchShortcut,
   useUi
-} from "./chunk-DXWIVGHP.js";
-import "./chunk-FAEVYSIF.js";
+} from "./chunk-XDCGYHLF.js";
+import "./chunk-7G7C6G3A.js";
 import {
   AGENT_ERROR_CODES,
   AGENT_PROTOCOL,
   AI_MESSAGES,
   AI_PROVIDERS,
   DEFAULT_CLAUDE_MODEL,
-  EMAIL_PURPOSES,
   EmailGenerationError,
   GENERATION_ERRORS,
-  MAX_DETAILS_LENGTH,
   MAX_REWRITE_INSTRUCTION,
-  PURPOSE_CATEGORIES,
   REWRITE_ACTIONS,
   REWRITE_LANGUAGES,
   agentEmailModel,
   claudeEmailModel,
   claudeProvider,
   createEmailGenerator,
+  diffWords,
   emailWords,
   failureCode,
   listProviderModels,
   providerEmailModel,
-  purposesByCategory,
-  resolveProvider
-} from "./chunk-SHHHYRPC.js";
-import "./chunk-OWVXKMLI.js";
-import "./chunk-AXIM6E7T.js";
-import {
-  brandTemplate,
-  hasBrand
-} from "./chunk-62HBUBBI.js";
+  resolveProvider,
+  visibleText
+} from "./chunk-24E4GOHU.js";
+import "./chunk-VQRVBQIB.js";
+import "./chunk-MBZI6NVP.js";
 
 // src/ai/keys.js
 var STORAGE_PREFIX = "best-email-builder:ai-key:";
 var CHOICE_SLOT = "best-email-builder:ai-provider";
 var MODEL_PREFIX = "best-email-builder:ai-model:";
+var ADDRESS_PREFIX = "best-email-builder:ai-address:";
 function browserStorage() {
   try {
     const storage = globalThis.localStorage;
@@ -76,8 +67,11 @@ var choiceOf = (provider) => Object.freeze({
   keyUrl: provider.keyUrl,
   keyHint: provider.keyHint,
   free: provider.free,
-  publicModels: Boolean(provider.publicModels)
+  publicModels: Boolean(provider.publicModels),
+  keyless: Boolean(provider.keyless),
+  needsAddress: !provider.createModel && !provider.baseUrl
 });
+var cleanAddress = (url) => String(url || "").trim().replace(/\/+$/, "");
 function createKeyStore(providerOrList, { fetch: fetchImpl } = {}) {
   const originals = Array.isArray(providerOrList) ? providerOrList : [providerOrList];
   const providers = Object.freeze(originals.map(choiceOf));
@@ -117,17 +111,28 @@ function createKeyStore(providerOrList, { fetch: fetchImpl } = {}) {
     return id;
   };
   const lists = /* @__PURE__ */ new Map();
+  const modelOf = (choice) => (memory.get(MODEL_PREFIX + choice.id) ?? read(MODEL_PREFIX + choice.id)) || choice.model || "";
+  const addressOf = (choice) => choice.needsAddress ? cleanAddress(memory.get(ADDRESS_PREFIX + choice.id) ?? read(ADDRESS_PREFIX + choice.id)) : "";
+  const ready = () => {
+    const choice = (
+      /** @type {ProviderChoice} */
+      providers.find((provider) => provider.id === current)
+    );
+    if (refused) return false;
+    if (!choice.keyless && !get()) return false;
+    if (choice.needsAddress && !addressOf(choice)) return false;
+    return Boolean(modelOf(choice));
+  };
   const changed = () => {
-    snapshot = Object.freeze({ asking: Boolean(pending), refused, connected: Boolean(get()) });
+    snapshot = Object.freeze({ asking: Boolean(pending), refused, connected: ready() });
     for (const listener of [...listeners]) listener();
   };
-  snapshot = Object.freeze({ asking: false, refused: false, connected: Boolean(get()) });
+  snapshot = Object.freeze({ asking: false, refused: false, connected: ready() });
   const answer = (key) => {
     const value = String(key || "").trim();
-    if (value) {
-      keep(current, value);
-      refused = false;
-    }
+    if (value) keep(current, value);
+    if (key !== null && (value || get() || /** @type {ProviderChoice} */
+    providers.find((provider) => provider.id === current).keyless)) refused = false;
     const waiting = pending;
     pending = null;
     changed();
@@ -158,14 +163,27 @@ function createKeyStore(providerOrList, { fetch: fetchImpl } = {}) {
       write(CHOICE_SLOT, id);
       changed();
     },
-    model: (id) => {
+    model: (id) => modelOf(
+      /** @type {ProviderChoice} */
+      providers.find((provider) => provider.id === providerId(id))
+    ),
+    address: (id) => addressOf(
+      /** @type {ProviderChoice} */
+      providers.find((provider) => provider.id === providerId(id))
+    ),
+    setAddress: (url, id) => {
       const choice = (
         /** @type {ProviderChoice} */
         providers.find((provider) => provider.id === providerId(id))
       );
-      const kept2 = memory.get(MODEL_PREFIX + choice.id) ?? read(MODEL_PREFIX + choice.id);
-      return kept2 || choice.model || "";
+      if (!choice.needsAddress) throw new TypeError(`ai.key.setAddress: ${choice.name} has an address of its own`);
+      const value = cleanAddress(url);
+      if (value && !/^https?:\/\/[^\s/]+/i.test(value)) throw new TypeError("ai.key.setAddress: an http(s) address, e.g. http://localhost:1234/v1");
+      memory.set(ADDRESS_PREFIX + choice.id, value);
+      write(ADDRESS_PREFIX + choice.id, value);
+      changed();
     },
+    ready,
     chooseModel: (model, id) => {
       if (typeof model !== "string" || !model.trim()) throw new TypeError("ai.key.chooseModel: a model id");
       const choice = (
@@ -177,12 +195,16 @@ function createKeyStore(providerOrList, { fetch: fetchImpl } = {}) {
       write(MODEL_PREFIX + choice.id, value);
       changed();
     },
-    listModels: async (id, { apiKey, signal } = {}) => {
-      const at = providers.findIndex((provider) => provider.id === providerId(id));
+    listModels: async (id, { apiKey, address, signal } = {}) => {
+      const at = providers.findIndex((provider2) => provider2.id === providerId(id));
       const key = String(apiKey ?? keyOf(providers[at].id)).trim();
+      const where = providers[at].needsAddress ? cleanAddress(address ?? addressOf(providers[at])) : "";
+      if (providers[at].needsAddress && !where) return [];
       const slot = `${providers[at].id}
-${key}`;
-      if (!lists.has(slot)) lists.set(slot, await listProviderModels({ provider: originals[at], apiKey: key, fetch: fetchImpl, signal }));
+${key}
+${where}`;
+      const provider = where ? { ...originals[at], baseUrl: where } : originals[at];
+      if (!lists.has(slot)) lists.set(slot, await listProviderModels({ provider, apiKey: key, fetch: fetchImpl, signal }));
       return lists.get(slot);
     },
     request: () => {
@@ -200,7 +222,7 @@ ${key}`;
       return () => listeners.delete(listener);
     },
     state: () => snapshot,
-    answer: (key) => answer(key || ""),
+    answer: (key) => answer(key ?? null),
     refuse: () => {
       keep(current, "");
       refused = true;
@@ -211,16 +233,16 @@ ${key}`;
 
 // src/ai/ConnectAi.jsx
 import { useEffect as useEffect2, useId as useId2, useRef as useRef2, useState as useState2, useSyncExternalStore } from "react";
-import { ArrowUpRight, Eye, EyeOff, Gift as Gift2, KeyRound, ShieldCheck, TriangleAlert } from "lucide-react";
+import { ArrowUpRight, Eye, EyeOff, KeyRound, ShieldCheck, TriangleAlert } from "lucide-react";
 
 // src/ai/ModelPicker.jsx
 import { useEffect, useId, useMemo, useRef, useState } from "react";
-import { Check, ChevronDown, Gift, LoaderCircle, Search } from "lucide-react";
+import { Check, ChevronDown, LoaderCircle, Search } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open, onOpenChange }) {
+function ModelPicker({ aiKey, provider, apiKey, address = "", delay = 0, value, onChange, open, onOpenChange }) {
   const { t } = useUi();
   const [list, setList] = useState(
-    /** @type {{status: 'loading'|'ready'|'needs-key'|'refused'|'failed', models: import('./providers.js').ModelChoice[]}} */
+    /** @type {{status: 'loading'|'ready'|'needs-key'|'needs-address'|'refused'|'failed', models: import('./providers.js').ModelChoice[]}} */
     { status: "loading", models: [] }
   );
   const [query, setQuery] = useState("");
@@ -239,14 +261,18 @@ function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open
   const listId = useId();
   const hintId = useId();
   useEffect(() => {
-    if (!apiKey && !provider.publicModels) {
+    if (provider.needsAddress && !address) {
+      setList({ status: "needs-address", models: [] });
+      return void 0;
+    }
+    if (!apiKey && !provider.publicModels && !provider.keyless) {
       setList({ status: "needs-key", models: [] });
       return void 0;
     }
     const controller = new AbortController();
     setList({ status: "loading", models: [] });
     const timer = setTimeout(() => {
-      aiKey.listModels(provider.id, { apiKey, signal: controller.signal }).then(
+      aiKey.listModels(provider.id, { apiKey, address, signal: controller.signal }).then(
         (models2) => !controller.signal.aborted && setList({ status: "ready", models: models2 }),
         (error) => !controller.signal.aborted && setList({ status: error?.code === "KEY_REFUSED" ? "refused" : "failed", models: [] })
       );
@@ -255,7 +281,7 @@ function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open
       clearTimeout(timer);
       controller.abort();
     };
-  }, [aiKey, provider.id, provider.publicModels, apiKey, delay]);
+  }, [aiKey, provider.id, provider.publicModels, provider.keyless, provider.needsAddress, apiKey, address, delay]);
   useEffect(() => {
     if (!open) return;
     setQuery("");
@@ -305,10 +331,7 @@ function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open
   };
   const optionId = (at) => `${listId}-${at}`;
   const badges = (model) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    model.free && /* @__PURE__ */ jsxs("span", { className: "eb:inline-flex eb:shrink-0 eb:items-center eb:gap-1 eb:rounded-full eb:bg-success/10 eb:px-1.5 eb:py-px eb:text-[10.5px] eb:font-medium eb:text-success", children: [
-      /* @__PURE__ */ jsx(Gift, { className: "eb:size-3", "aria-hidden": "true" }),
-      t("Free")
-    ] }),
+    model.free && /* @__PURE__ */ jsx("span", { className: "eb:shrink-0 eb:rounded-full eb:bg-success/10 eb:px-1.5 eb:py-px eb:text-[10.5px] eb:font-medium eb:text-success", children: t("Free") }),
     model.id === provider.model && /* @__PURE__ */ jsx("span", { className: "eb:shrink-0 eb:rounded-full eb:bg-muted eb:px-1.5 eb:py-px eb:text-[10.5px] eb:font-medium eb:text-foreground-lighter", children: t("Default") })
   ] });
   const status = {
@@ -317,8 +340,9 @@ function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open
       t("Loading the models of {provider}\u2026", { provider: provider.name })
     ] }),
     "needs-key": t("Paste the key to see all the models of {provider}.", { provider: provider.name }),
+    "needs-address": t("Give the API address to see its models."),
     refused: /* @__PURE__ */ jsx("span", { className: "eb:text-warning", children: t("{provider} refused this key: its models could not be listed.", { provider: provider.name }) }),
-    failed: t("The list of models could not be loaded. The default model works, or type the id of another."),
+    failed: provider.model ? t("The list of models could not be loaded. The default model works, or type the id of another.") : t("The list of models could not be loaded. Type the id of the model."),
     ready: list.models.length ? hasFree ? t("{count} models, the free ones first.", { count: list.models.length }) : t("{count} models.", { count: list.models.length }) : t("{provider} lists no models here: type the id of the one you want.", { provider: provider.name })
   }[list.status];
   return /* @__PURE__ */ jsxs("div", { className: "eb:flex eb:flex-col eb:gap-1.5", "data-testid": "eb-ai-connect-model-field", children: [
@@ -379,20 +403,17 @@ function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open
                 }
               )
             ] }),
-            hasFree && /* @__PURE__ */ jsxs(
+            hasFree && /* @__PURE__ */ jsx(
               "button",
               {
                 type: "button",
                 "aria-pressed": freeOnly,
                 onClick: () => setFreeOnly((on) => !on),
                 className: cn(
-                  "eb:inline-flex eb:h-8 eb:shrink-0 eb:items-center eb:gap-1.5 eb:rounded-md eb:border eb:px-2.5 eb:text-[12px] eb:font-medium eb:transition-colors eb:outline-none eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50",
+                  "eb:inline-flex eb:h-8 eb:shrink-0 eb:items-center eb:rounded-md eb:border eb:px-2.5 eb:text-[12px] eb:font-medium eb:transition-colors eb:outline-none eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50",
                   freeOnly ? "eb:border-success/40 eb:bg-success/10 eb:text-success" : "eb:border-border eb:text-foreground-lighter eb:hover:bg-muted"
                 ),
-                children: [
-                  /* @__PURE__ */ jsx(Gift, { className: "eb:size-3.5", "aria-hidden": "true" }),
-                  t("Free only")
-                ]
+                children: t("Free only")
               }
             )
           ] }),
@@ -460,10 +481,12 @@ function ModelPicker({ aiKey, provider, apiKey, delay = 0, value, onChange, open
 // src/ai/ConnectAi.jsx
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var LISTABLE_KEY = 20;
+var ADDRESS = /^https?:\/\/[^\s/]+/i;
 function ConnectAi({ aiKey }) {
   const { t } = useUi();
   const state = useSyncExternalStore(aiKey.subscribe, aiKey.state, aiKey.state);
   const [value, setValue] = useState2("");
+  const [address, setAddress] = useState2("");
   const [shown, setShown] = useState2(false);
   const [chosenId, setChosenId] = useState2(aiKey.provider.id);
   const [picks, setPicks] = useState2(
@@ -475,18 +498,25 @@ function ConnectAi({ aiKey }) {
     /** @type {HTMLInputElement|null} */
     null
   );
+  const addressRef = useRef2(
+    /** @type {HTMLInputElement|null} */
+    null
+  );
   const choicesRef = useRef2(
     /** @type {HTMLDivElement|null} */
     null
   );
   const inputId = useId2();
   const hintId = useId2();
+  const addressId = useId2();
+  const addressHintId = useId2();
   const choices = aiKey.providers;
   const chosen = choices.find((provider) => provider.id === chosenId) || aiKey.provider;
-  const { name, keyUrl, keyHint, free } = chosen;
+  const { name, keyUrl, keyHint, free, keyless, needsAddress } = chosen;
   useEffect2(() => {
     if (!state.asking) return;
     setChosenId(aiKey.provider.id);
+    setAddress(aiKey.address());
     setValue("");
     setShown(false);
     setPicks({});
@@ -497,16 +527,20 @@ function ConnectAi({ aiKey }) {
   const unusual = Boolean(key && keyHint && !key.startsWith(keyHint));
   const refused = state.refused && chosen.id === aiKey.provider.id;
   const modelFor = (id) => picks[id] ?? aiKey.model(id);
+  const where = address.trim().replace(/\/+$/, "");
+  const addressOk = !needsAddress || ADDRESS.test(where);
+  const ready = Boolean((key || saved || keyless) && (!needsAddress || where && addressOk) && modelFor(chosen.id));
   const submit = (event) => {
     event.preventDefault();
-    const answer = key || saved;
-    if (!answer) return;
+    if (!ready) return;
+    if (needsAddress && where !== aiKey.address(chosen.id)) aiKey.setAddress(where, chosen.id);
     if (chosen.id !== aiKey.provider.id) aiKey.choose(chosen.id);
     if (picks[chosen.id] && picks[chosen.id] !== aiKey.model(chosen.id)) aiKey.chooseModel(picks[chosen.id], chosen.id);
-    aiKey.answer(answer);
+    aiKey.answer(key || saved);
   };
   const choose = (id) => {
     setChosenId(id);
+    setAddress(aiKey.address(id));
     setValue("");
     setModelsOpen(false);
   };
@@ -526,7 +560,7 @@ function ConnectAi({ aiKey }) {
       "data-testid": "eb-ai-connect",
       onOpenAutoFocus: (event) => {
         event.preventDefault();
-        inputRef.current?.focus();
+        (needsAddress && !where ? addressRef : inputRef).current?.focus();
       },
       onEscapeKeyDown: (event) => {
         if (!modelsOpen) return;
@@ -539,7 +573,7 @@ function ConnectAi({ aiKey }) {
             /* @__PURE__ */ jsx2("span", { className: "eb:flex eb:size-10 eb:shrink-0 eb:items-center eb:justify-center eb:rounded-full eb:bg-primary/10 eb:text-primary", children: /* @__PURE__ */ jsx2(KeyRound, { className: "eb:size-5", "aria-hidden": "true" }) }),
             /* @__PURE__ */ jsxs2("div", { className: "eb:flex eb:flex-col eb:gap-1.5", children: [
               /* @__PURE__ */ jsx2(DialogTitle, { children: t("Connect {provider}", { provider: name }) }),
-              /* @__PURE__ */ jsx2(DialogDescription, { className: "eb:text-[13px] eb:leading-relaxed eb:text-foreground-lighter", children: t("The AI writes with your own {provider} key. Connect it once: this browser remembers it.", { provider: name }) })
+              /* @__PURE__ */ jsx2(DialogDescription, { className: "eb:text-[13px] eb:leading-relaxed eb:text-foreground-lighter", children: needsAddress ? t("The AI writes with an OpenAI-compatible API of your choice. Give its address, and its key if it needs one: this browser remembers them.") : t("The AI writes with your own {provider} key. Connect it once: this browser remembers it.", { provider: name }) })
             ] })
           ] }),
           choices.length > 1 && /* @__PURE__ */ jsx2(
@@ -568,7 +602,6 @@ function ConnectAi({ aiKey }) {
                     children: [
                       /* @__PURE__ */ jsxs2("span", { className: "eb:flex eb:items-center eb:gap-1.5 eb:text-[13px] eb:leading-tight eb:font-medium eb:text-foreground", children: [
                         /* @__PURE__ */ jsx2("span", { className: "eb:truncate", children: provider.name }),
-                        provider.free && /* @__PURE__ */ jsx2(Gift2, { className: "eb:size-3 eb:shrink-0 eb:text-success", "aria-label": t(provider.free) }),
                         aiKey.get(provider.id) && /* @__PURE__ */ jsx2("span", { className: "eb:ml-auto eb:size-1.5 eb:shrink-0 eb:rounded-full eb:bg-success", title: t("Key saved"), "aria-label": t("Key saved") })
                       ] }),
                       modelFor(provider.id) && /* @__PURE__ */ jsx2("span", { className: "eb:truncate eb:font-mono eb:text-[10.5px] eb:text-foreground-muted", title: modelFor(provider.id), children: modelFor(provider.id) })
@@ -601,13 +634,34 @@ function ConnectAi({ aiKey }) {
                 ]
               }
             ) }),
-            free && /* @__PURE__ */ jsxs2("span", { className: "eb:inline-flex eb:items-center eb:gap-1.5 eb:rounded-full eb:bg-success/10 eb:px-2.5 eb:py-1 eb:text-[11.5px] eb:font-medium eb:text-success", children: [
-              /* @__PURE__ */ jsx2(Gift2, { className: "eb:size-3.5", "aria-hidden": "true" }),
-              t(free)
-            ] })
+            free && /* @__PURE__ */ jsx2("span", { className: "eb:rounded-full eb:bg-success/10 eb:px-2.5 eb:py-1 eb:text-[11.5px] eb:font-medium eb:text-success", children: t(free) })
+          ] }),
+          needsAddress && /* @__PURE__ */ jsxs2("div", { className: "eb:flex eb:flex-col eb:gap-1.5", children: [
+            /* @__PURE__ */ jsx2(Label, { htmlFor: addressId, children: t("API address") }),
+            /* @__PURE__ */ jsx2(
+              Input,
+              {
+                ref: addressRef,
+                id: addressId,
+                type: "url",
+                inputMode: "url",
+                value: address,
+                onChange: (event) => setAddress(event.target.value),
+                placeholder: "http://localhost:1234/v1",
+                autoComplete: "url",
+                autoCapitalize: "off",
+                autoCorrect: "off",
+                spellCheck: false,
+                "aria-invalid": where && !addressOk ? true : void 0,
+                "aria-describedby": addressHintId,
+                className: "eb:h-9 eb:font-mono eb:text-[12.5px]",
+                "data-testid": "eb-ai-connect-address"
+              }
+            ),
+            /* @__PURE__ */ jsx2("p", { id: addressHintId, className: "eb:text-[11.5px] eb:leading-relaxed eb:text-foreground-muted", children: where && !addressOk ? /* @__PURE__ */ jsx2("span", { className: "eb:text-warning", children: t("An address starts with http:// or https://.") }) : t("Any API that speaks OpenAI: LM Studio, vLLM, Ollama, a proxy of your own\u2026 It must accept requests from this page (CORS).") })
           ] }),
           /* @__PURE__ */ jsxs2("div", { className: "eb:flex eb:flex-col eb:gap-1.5", children: [
-            /* @__PURE__ */ jsx2(Label, { htmlFor: inputId, children: t("API key") }),
+            /* @__PURE__ */ jsx2(Label, { htmlFor: inputId, children: keyless ? t("API key (optional)") : t("API key") }),
             /* @__PURE__ */ jsxs2("div", { className: "eb:relative", children: [
               /* @__PURE__ */ jsx2(
                 Input,
@@ -639,15 +693,16 @@ function ConnectAi({ aiKey }) {
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx2("p", { id: hintId, className: "eb:min-h-4 eb:text-[11.5px] eb:text-foreground-muted", children: unusual ? /* @__PURE__ */ jsx2("span", { className: "eb:text-warning", children: t("{provider} keys usually start with {prefix}.", { provider: name, prefix: keyHint }) }) : saved && !key ? t("A key for {provider} is saved in this browser: Connect uses it, or paste another one.", { provider: name }) : keyHint ? t("{provider} keys start with {prefix}.", { provider: name, prefix: keyHint }) : null })
+            /* @__PURE__ */ jsx2("p", { id: hintId, className: "eb:min-h-4 eb:text-[11.5px] eb:text-foreground-muted", children: unusual ? /* @__PURE__ */ jsx2("span", { className: "eb:text-warning", children: t("{provider} keys usually start with {prefix}.", { provider: name, prefix: keyHint }) }) : saved && !key ? t("A key for {provider} is saved in this browser: Connect uses it, or paste another one.", { provider: name }) : keyHint ? t("{provider} keys start with {prefix}.", { provider: name, prefix: keyHint }) : keyless ? t("Leave it empty if the API needs no key.") : null })
           ] }),
           /* @__PURE__ */ jsx2(
             ModelPicker,
             {
               aiKey,
               provider: chosen,
-              apiKey: key.length >= LISTABLE_KEY ? key : saved,
-              delay: key.length >= LISTABLE_KEY ? 350 : 0,
+              apiKey: key.length >= LISTABLE_KEY || keyless && key ? key : saved,
+              address: addressOk ? where : "",
+              delay: key.length >= LISTABLE_KEY || keyless && key || where !== aiKey.address(chosen.id) ? 350 : 0,
               value: modelFor(chosen.id),
               onChange: (model) => setPicks((current) => ({ ...current, [chosen.id]: model })),
               open: modelsOpen,
@@ -657,53 +712,56 @@ function ConnectAi({ aiKey }) {
         ] }),
         /* @__PURE__ */ jsxs2("div", { className: "eb:flex eb:items-start eb:gap-2 eb:border-t eb:border-border eb:bg-surface-75 eb:px-6 eb:py-3 eb:text-[11.5px] eb:leading-relaxed eb:text-foreground-lighter", children: [
           /* @__PURE__ */ jsx2(ShieldCheck, { className: "eb:mt-0.5 eb:size-3.5 eb:shrink-0 eb:text-foreground-muted", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx2("span", { children: t("The key stays in this browser and is sent only to {provider}.", { provider: name }) })
+          /* @__PURE__ */ jsx2("span", { children: needsAddress ? t("The address and the key stay in this browser; the key is sent only to that address.") : t("The key stays in this browser and is sent only to {provider}.", { provider: name }) })
         ] }),
         /* @__PURE__ */ jsxs2(DialogFooter, { className: "eb:border-t eb:border-border eb:px-6 eb:py-4", children: [
           /* @__PURE__ */ jsx2(Button, { type: "button", variant: "ghost", onClick: () => aiKey.answer(null), children: t("Cancel") }),
-          /* @__PURE__ */ jsx2(Button, { type: "submit", disabled: !key && !saved, "data-testid": "eb-ai-connect-submit", children: t("Connect") })
+          /* @__PURE__ */ jsx2(Button, { type: "submit", disabled: !ready, "data-testid": "eb-ai-connect-submit", children: t("Connect") })
         ] })
       ] })
     }
   ) });
 }
 
-// src/ai/GenerateButton.jsx
-import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
-import { Check as Check2, Loader2, Search as Search2, Sparkles, TriangleAlert as TriangleAlert2 } from "lucide-react";
-
-// src/ai/chip.js
-var chipClassName = (selected = false) => cn(
-  "eb:inline-flex eb:h-7 eb:items-center eb:gap-1 eb:rounded-full eb:border eb:px-3 eb:text-[12px] eb:font-medium eb:transition-colors eb:outline-none eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50 eb:disabled:opacity-50",
-  selected ? "eb:border-primary eb:bg-primary eb:text-primary-foreground" : "eb:border-border eb:bg-background eb:text-foreground eb:hover:border-primary/50 eb:hover:bg-primary/5"
-);
-
-// src/ai/GenerateButton.jsx
+// src/ai/ProofreadButton.jsx
+import { useEffect as useEffect3, useRef as useRef3, useState as useState3 } from "react";
+import { Check as Check2, CircleCheck, Loader2, SpellCheck, TriangleAlert as TriangleAlert2 } from "lucide-react";
 import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var fold = (text) => text.normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
-function GenerateButton({ context, generate: generateEmail }) {
-  const { editor, ready, isDirty, markDirty, template, setMeta, variables, sender, brand } = context;
+var LABEL_TAGS = { "mj-button": "button", "mj-navbar-link": "link" };
+var KIND_LABELS = { subject: "Subject", preheader: "Preview text", text: "Text", button: "Button", link: "Menu link" };
+function textsOf(editor, meta) {
+  const texts = [];
+  if (meta.subject.trim()) texts.push({ id: "subject", kind: "subject", format: "plain", text: meta.subject.trim() });
+  if (meta.preheader.trim()) texts.push({ id: "preheader", kind: "preheader", format: "plain", text: meta.preheader.trim() });
+  const walk = (node) => {
+    if (!node || typeof node !== "object") return;
+    const element = node.tag === "mj-text" || LABEL_TAGS[node.tag] ? editor.getElement(node.id) : null;
+    if (node.tag === "mj-text" && element?.html) texts.push({ id: node.id, kind: "text", format: "html", text: element.html });
+    else if (LABEL_TAGS[node.tag] && element?.content) texts.push({ id: node.id, kind: LABEL_TAGS[node.tag], format: "plain", text: element.content });
+    for (const child of node.children || []) walk(child);
+  };
+  walk(editor.getDocument().project?.root);
+  return texts;
+}
+function currentText(editor, meta, id) {
+  if (id === "subject" || id === "preheader") return meta[id].trim();
+  const element = editor.getElement(id);
+  return (element?.tagName === "mj-text" ? element?.html : element?.content) ?? null;
+}
+function ProofreadButton({ context, proofread }) {
+  const { editor, ready, meta, setMeta } = context;
   const { t, locale, notify } = useUi();
   const [open, setOpen] = useState3(false);
-  const [purpose, setPurpose] = useState3(
-    /** @type {string|null} */
-    null
-  );
-  const [details, setDetails] = useState3("");
-  const [query, setQuery] = useState3("");
   const [busy, setBusy] = useState3(false);
   const [error, setError] = useState3("");
   const [seconds, setSeconds] = useState3(0);
-  const [dirty, setDirty] = useState3(false);
+  const [fixes, setFixes] = useState3(null);
   const abortRef = useRef3(
     /** @type {AbortController|null} */
     null
   );
-  const searchRef = useRef3(
-    /** @type {HTMLInputElement|null} */
-    null
-  );
-  useSearchShortcut(searchRef);
+  const metaRef = useRef3(meta);
+  metaRef.current = meta;
   useEffect3(() => () => abortRef.current?.abort(), []);
   useEffect3(() => {
     if (!busy) return void 0;
@@ -711,168 +769,178 @@ function GenerateButton({ context, generate: generateEmail }) {
     const timer = setInterval(() => setSeconds((s) => s + 1), 1e3);
     return () => clearInterval(timer);
   }, [busy]);
-  const groups = useMemo2(() => {
-    const words = fold(query.trim()).split(/\s+/).filter(Boolean);
-    return purposesByCategory().map((group) => ({
-      ...group,
-      purposes: group.purposes.filter((entry) => {
-        const label = fold(`${t(entry.label)} ${entry.label} ${t(group.label)}`);
-        return words.every((word) => label.includes(word));
-      })
-    })).filter((group) => group.purposes.length > 0);
-  }, [query, t]);
-  const openDialog = () => {
-    setError("");
-    setDirty(isDirty());
-    setOpen(true);
-  };
-  const close = (next) => {
-    if (next) return;
-    abortRef.current?.abort();
-    setOpen(false);
-  };
-  const generate = async () => {
-    if (busy || !purpose && !details.trim()) return;
+  useEffect3(
+    () => editor.on("load", () => {
+      abortRef.current?.abort();
+      setOpen(false);
+    }),
+    [editor]
+  );
+  const run = async () => {
+    if (busy) return;
+    const texts = textsOf(editor, metaRef.current);
     setError("");
+    setFixes(null);
+    if (!texts.length) {
+      setError(t("The email has no text to check yet."));
+      return;
+    }
     setBusy(true);
     const controller = new AbortController();
     abortRef.current = controller;
     try {
-      const email = await generateEmail(
-        {
-          purpose,
-          details: details.trim(),
-          language: String(locale || "en").slice(0, 2),
-          sender: sender || {},
-          ...hasBrand(brand) ? { brand: { primary: brand.primary, heading: brand.heading, font: brand.font } } : {},
-          variables: (variables || []).map((variable) => ({ key: variable.key, label: variable.label }))
-        },
+      const result = await proofread(
+        { texts: texts.map(({ id, kind, format, text }) => ({ id, kind, format, text })), language: String(locale || "en").slice(0, 2) },
         { signal: controller.signal }
       );
       if (controller.signal.aborted) return;
-      editor.loadMjml(hasBrand(brand) ? brandTemplate(email.mjml, brand, { sender, t }) : email.mjml);
-      setMeta((meta) => ({
-        ...meta,
-        name: meta.name || email.name,
-        subject: email.subject || meta.subject,
-        preheader: email.preheader || meta.preheader
-      }));
-      if (template.id) markDirty();
-      setOpen(false);
-      notify("success", t("Your email is ready. Edit anything, then save."));
+      const sent = new Map(texts.map((text) => [text.id, text]));
+      setFixes(
+        result.fixes.filter((fix) => sent.has(fix.id)).map((fix) => {
+          const text = (
+            /** @type {(typeof texts)[number]} */
+            sent.get(fix.id)
+          );
+          const stale = currentText(editor, metaRef.current, fix.id) !== text.text;
+          return { id: fix.id, kind: text.kind, format: text.format, before: text.text, after: fix.text, state: stale ? "stale" : "open" };
+        })
+      );
     } catch (err) {
-      if (!controller.signal.aborted) setError(err?.message ? t(err.message) : t("The email could not be generated."));
+      if (!controller.signal.aborted) setError(err?.message ? t(err.message) : t("The email could not be checked."));
     } finally {
-      if (abortRef.current === controller) abortRef.current = null;
-      setBusy(false);
+      if (abortRef.current === controller) {
+        abortRef.current = null;
+        setBusy(false);
+      }
     }
   };
-  const cancel = () => {
+  useEffect3(() => {
+    if (!open) return void 0;
+    run();
+    return () => abortRef.current?.abort();
+  }, [open]);
+  const openDialog = () => setOpen(true);
+  const close = (next) => {
+    if (next) return;
     abortRef.current?.abort();
+    abortRef.current = null;
     setBusy(false);
+    setOpen(false);
   };
-  const canGenerate = Boolean(purpose || details.trim());
+  const apply = (ids) => {
+    if (!fixes) return;
+    const wanted = new Set(ids);
+    const contents = [];
+    const metaChanges = {};
+    const next = fixes.map((fix) => {
+      if (!wanted.has(fix.id) || fix.state !== "open") return fix;
+      if (currentText(editor, metaRef.current, fix.id) !== fix.before) return { ...fix, state: (
+        /** @type {const} */
+        "stale"
+      ) };
+      if (fix.id === "subject" || fix.id === "preheader") metaChanges[fix.id] = fix.after;
+      else contents.push({ id: fix.id, content: fix.format === "html" ? cleanRichText(fix.after, document) : fix.after });
+      return { ...fix, state: (
+        /** @type {const} */
+        "applied"
+      ) };
+    });
+    if (contents.length) editor.setContents(contents);
+    if (Object.keys(metaChanges).length) setMeta((current) => ({ ...current, ...metaChanges }));
+    setFixes(next);
+    const applied = next.filter((fix, index) => fix.state === "applied" && fixes[index].state !== "applied").length;
+    if (applied && next.every((fix) => fix.state !== "open")) {
+      setOpen(false);
+      notify("success", t("Corrections applied: {count}.", { count: next.filter((fix) => fix.state === "applied").length }));
+    }
+  };
+  const remaining = (fixes || []).filter((fix) => fix.state === "open");
   return /* @__PURE__ */ jsxs3(Fragment2, { children: [
     /* @__PURE__ */ jsxs3(Button, { variant: "outline", size: "sm-compact", disabled: !ready, onClick: openDialog, children: [
-      /* @__PURE__ */ jsx3(Sparkles, {}),
-      t("Generate")
+      /* @__PURE__ */ jsx3(SpellCheck, {}),
+      t("Proofread")
     ] }),
-    /* @__PURE__ */ jsx3(Dialog, { open, onOpenChange: close, children: /* @__PURE__ */ jsxs3(
-      DialogContent,
-      {
-        className: "eb:flex eb:max-h-[calc(100dvh-2rem)] eb:flex-col eb:gap-0 eb:p-0 eb:sm:max-w-2xl",
-        "data-testid": "eb-generate",
-        onOpenAutoFocus: (event) => {
-          event.preventDefault();
-          searchRef.current?.focus();
-        },
-        children: [
-          /* @__PURE__ */ jsxs3(DialogHeader, { className: "eb:gap-1.5 eb:px-6 eb:pt-6 eb:pb-3", children: [
-            /* @__PURE__ */ jsx3(DialogTitle, { children: t("Generate an email") }),
-            /* @__PURE__ */ jsx3(DialogDescription, { children: t("Pick what it is for. AI writes a complete email that opens here, ready to edit.") })
-          ] }),
-          /* @__PURE__ */ jsx3("div", { className: "eb:px-6 eb:pb-3", children: /* @__PURE__ */ jsxs3("div", { className: "eb:relative", children: [
-            /* @__PURE__ */ jsx3(Search2, { className: "eb:pointer-events-none eb:absolute eb:top-1/2 eb:left-2.5 eb:size-3.5 eb:-translate-y-1/2 eb:text-foreground-muted", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx3(
-              Input,
-              {
-                ref: searchRef,
-                type: "search",
-                value: query,
-                onChange: (event) => setQuery(event.target.value),
-                placeholder: t("Search: sale, password, birthday\u2026"),
-                "aria-label": t("Search"),
-                "aria-keyshortcuts": SEARCH_KEYS,
-                className: "eb:pr-16 eb:pl-8 eb:[&::-webkit-search-cancel-button]:hidden",
-                disabled: busy
-              }
-            ),
-            /* @__PURE__ */ jsx3(SearchKeyHint, { className: "eb:absolute eb:top-1/2 eb:right-2 eb:-translate-y-1/2" })
-          ] }) }),
-          /* @__PURE__ */ jsx3("div", { className: "eb:min-h-0 eb:flex-1 eb:overflow-y-auto eb:border-y eb:border-border eb:px-6 eb:py-4", "data-testid": "eb-generate-purposes", children: /* @__PURE__ */ jsxs3("fieldset", { disabled: busy, className: "eb:m-0 eb:min-w-0 eb:border-0 eb:p-0", children: [
-            /* @__PURE__ */ jsx3("legend", { className: "eb:sr-only", children: t("What is the email for?") }),
-            groups.length === 0 && /* @__PURE__ */ jsx3("p", { className: "eb:py-6 eb:text-center eb:text-[13px] eb:text-foreground-muted", children: t("Nothing matches. Describe your email in the details below.") }),
-            /* @__PURE__ */ jsx3("div", { className: "eb:flex eb:flex-col eb:gap-4", children: groups.map((group) => /* @__PURE__ */ jsxs3("section", { className: "eb:flex eb:flex-col eb:gap-2", "aria-label": t(group.label), children: [
-              /* @__PURE__ */ jsx3(SectionLabel, { children: t(group.label) }),
-              /* @__PURE__ */ jsx3("div", { className: "eb:flex eb:flex-wrap eb:gap-1.5", children: group.purposes.map((entry) => {
-                const selected = purpose === entry.id;
-                return /* @__PURE__ */ jsxs3(
-                  "button",
-                  {
-                    type: "button",
-                    "aria-pressed": selected,
-                    "data-purpose": entry.id,
-                    onClick: () => setPurpose(selected ? null : entry.id),
-                    className: chipClassName(selected),
-                    children: [
-                      selected && /* @__PURE__ */ jsx3(Check2, { className: "eb:size-3", "aria-hidden": "true" }),
-                      t(entry.label)
-                    ]
-                  },
-                  entry.id
-                );
-              }) })
-            ] }, group.id)) })
-          ] }) }),
-          /* @__PURE__ */ jsxs3("div", { className: "eb:flex eb:flex-col eb:gap-3 eb:px-6 eb:pt-3 eb:pb-6", children: [
-            /* @__PURE__ */ jsx3(
-              Textarea,
-              {
-                value: details,
-                onChange: (event) => setDetails(event.target.value.slice(0, MAX_DETAILS_LENGTH)),
-                placeholder: t("Details (optional): product, dates, offer, tone, language\u2026"),
-                "aria-label": t("Details (optional)"),
-                rows: 2,
-                className: "eb:min-h-14",
-                disabled: busy,
-                onKeyDown: (event) => {
-                  if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) generate();
-                }
-              }
-            ),
-            error ? /* @__PURE__ */ jsxs3("p", { role: "alert", className: "eb:flex eb:items-start eb:gap-1.5 eb:text-[12px] eb:text-destructive", children: [
-              /* @__PURE__ */ jsx3(TriangleAlert2, { className: "eb:mt-px eb:size-3.5 eb:shrink-0", "aria-hidden": "true" }),
-              error
-            ] }) : dirty && !busy && /* @__PURE__ */ jsx3("p", { className: "eb:text-[12px] eb:text-foreground-muted", children: t("The email being edited will be replaced, unsaved changes included.") }),
-            /* @__PURE__ */ jsxs3("div", { className: "eb:flex eb:items-center eb:justify-end eb:gap-2", children: [
-              busy && /* @__PURE__ */ jsx3("p", { className: "eb:mr-auto eb:text-[12px] eb:text-foreground-muted", role: "status", "aria-live": "polite", children: t("Writing your email\u2026 {seconds} s", { seconds }) }),
-              busy && /* @__PURE__ */ jsx3(Button, { variant: "outline", size: "sm", onClick: cancel, children: t("Cancel") }),
-              /* @__PURE__ */ jsxs3(Button, { size: "sm", onClick: generate, disabled: !canGenerate || busy, "data-testid": "eb-generate-submit", children: [
-                busy ? /* @__PURE__ */ jsx3(Loader2, { className: "eb:animate-spin" }) : /* @__PURE__ */ jsx3(Sparkles, {}),
-                t("Generate")
-              ] })
-            ] })
-          ] })
-        ]
-      }
-    ) })
+    /* @__PURE__ */ jsx3(Dialog, { open, onOpenChange: close, children: /* @__PURE__ */ jsxs3(DialogContent, { className: "eb:flex eb:max-h-[calc(100dvh-2rem)] eb:flex-col eb:gap-0 eb:p-0 eb:sm:max-w-xl", "data-testid": "eb-proofread", children: [
+      /* @__PURE__ */ jsxs3(DialogHeader, { className: "eb:gap-1.5 eb:px-6 eb:pt-6 eb:pb-4", children: [
+        /* @__PURE__ */ jsx3(DialogTitle, { children: t("Proofread the email") }),
+        /* @__PURE__ */ jsx3(DialogDescription, { children: t("AI looks for spelling, grammar and punctuation mistakes in every text. Nothing changes until you apply it.") })
+      ] }),
+      /* @__PURE__ */ jsxs3("div", { className: "eb:min-h-0 eb:flex-1 eb:overflow-y-auto eb:border-t eb:border-border eb:px-6 eb:py-4", children: [
+        busy && /* @__PURE__ */ jsxs3("p", { className: "eb:flex eb:items-center eb:gap-2 eb:py-6 eb:text-[13px] eb:text-foreground-muted", role: "status", "aria-live": "polite", children: [
+          /* @__PURE__ */ jsx3(Loader2, { className: "eb:size-4 eb:animate-spin", "aria-hidden": "true" }),
+          t("Reading the email\u2026 {seconds} s", { seconds })
+        ] }),
+        error && /* @__PURE__ */ jsxs3("p", { role: "alert", className: "eb:flex eb:items-start eb:gap-1.5 eb:py-2 eb:text-[13px] eb:text-destructive", children: [
+          /* @__PURE__ */ jsx3(TriangleAlert2, { className: "eb:mt-0.5 eb:size-3.5 eb:shrink-0", "aria-hidden": "true" }),
+          error
+        ] }),
+        fixes && !fixes.length && /* @__PURE__ */ jsxs3("p", { className: "eb:flex eb:items-center eb:gap-2 eb:py-6 eb:text-[13px] eb:text-foreground", role: "status", children: [
+          /* @__PURE__ */ jsx3(CircleCheck, { className: "eb:size-4 eb:text-success", "aria-hidden": "true" }),
+          t("No mistake found.")
+        ] }),
+        fixes && fixes.length > 0 && /* @__PURE__ */ jsx3("ul", { className: "eb:flex eb:flex-col eb:gap-2.5", "aria-label": t("Corrections"), children: fixes.map((fix) => /* @__PURE__ */ jsxs3(
+          "li",
+          {
+            className: cn("eb:rounded-md eb:border eb:border-border eb:p-3", fix.state !== "open" && "eb:bg-muted/40"),
+            "data-testid": "eb-proofread-fix",
+            "data-state": fix.state,
+            children: [
+              /* @__PURE__ */ jsxs3("div", { className: "eb:mb-1.5 eb:flex eb:items-center eb:gap-2", children: [
+                /* @__PURE__ */ jsx3("span", { className: "eb:text-[11px] eb:font-medium eb:tracking-wide eb:text-foreground-muted eb:uppercase", children: t(KIND_LABELS[fix.kind]) }),
+                /* @__PURE__ */ jsxs3("span", { className: "eb:ml-auto", children: [
+                  fix.state === "open" && /* @__PURE__ */ jsx3(Button, { variant: "outline", size: "xs", onClick: () => apply([fix.id]), children: t("Apply") }),
+                  fix.state === "applied" && /* @__PURE__ */ jsxs3("span", { className: "eb:flex eb:items-center eb:gap-1 eb:text-[12px] eb:text-success", children: [
+                    /* @__PURE__ */ jsx3(Check2, { className: "eb:size-3.5", "aria-hidden": "true" }),
+                    t("Applied")
+                  ] }),
+                  fix.state === "stale" && /* @__PURE__ */ jsx3("span", { className: "eb:text-[12px] eb:text-foreground-muted", children: t("Text changed since \u2014 left as it is") })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx3(Changes, { before: fix.before, after: fix.after, html: fix.format === "html" })
+            ]
+          },
+          fix.id
+        )) })
+      ] }),
+      /* @__PURE__ */ jsx3("div", { className: "eb:flex eb:items-center eb:justify-end eb:gap-2 eb:border-t eb:border-border eb:px-6 eb:py-4", children: busy ? /* @__PURE__ */ jsx3(Button, { variant: "outline", size: "sm", onClick: () => close(false), children: t("Cancel") }) : /* @__PURE__ */ jsxs3(Fragment2, { children: [
+        /* @__PURE__ */ jsx3(Button, { variant: "ghost", size: "sm", className: "eb:mr-auto", onClick: run, children: t("Check again") }),
+        remaining.length > 0 ? /* @__PURE__ */ jsxs3(Button, { size: "sm", onClick: () => apply(remaining.map((fix) => fix.id)), "data-testid": "eb-proofread-apply-all", children: [
+          /* @__PURE__ */ jsx3(Check2, {}),
+          t("Apply all ({count})", { count: remaining.length })
+        ] }) : /* @__PURE__ */ jsx3(Button, { variant: "outline", size: "sm", onClick: () => close(false), children: t("Close") })
+      ] }) })
+    ] }) })
   ] });
 }
+function Changes({ before, after, html }) {
+  const parts = diffWords(html ? visibleText(before) : before, html ? visibleText(after) : after);
+  return /* @__PURE__ */ jsx3("p", { className: "eb:text-[13px] eb:leading-relaxed eb:break-words eb:whitespace-pre-line eb:text-foreground", children: parts.map(
+    (part, index) => part.type === "same" ? /* @__PURE__ */ jsx3("span", { children: around(part.text, index === 0, index === parts.length - 1) }, index) : part.type === "removed" ? /* @__PURE__ */ jsx3("del", { className: "eb:rounded-sm eb:bg-destructive/10 eb:text-destructive eb:line-through", children: part.text }, index) : /* @__PURE__ */ jsx3("ins", { className: "eb:rounded-sm eb:bg-success/15 eb:text-success eb:no-underline", children: part.text }, index)
+  ) });
+}
+var CONTEXT = 48;
+function around(text, first, last) {
+  if (text.length <= CONTEXT * 2 + 8) return text;
+  const head = (value) => value.slice(0, CONTEXT).replace(/\s\S*$/, "");
+  const tail = (value) => value.slice(-CONTEXT).replace(/^\S*\s/, "");
+  if (first && last) return text;
+  if (first) return `\u2026${tail(text)}`;
+  if (last) return `${head(text)}\u2026`;
+  return `${head(text)} \u2026 ${tail(text)}`;
+}
 
 // src/ai/RewriteText.jsx
 import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
-import { ChevronDown as ChevronDown2, Languages, Loader2 as Loader22, Sparkles as Sparkles2, TriangleAlert as TriangleAlert3 } from "lucide-react";
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { ChevronDown as ChevronDown2, Languages, Loader2 as Loader22, PenLine, Sparkles, TriangleAlert as TriangleAlert3 } from "lucide-react";
+
+// src/ai/chip.js
+var chipClassName = (selected = false) => cn(
+  "eb:inline-flex eb:h-7 eb:items-center eb:gap-1 eb:rounded-full eb:border eb:px-3 eb:text-[12px] eb:font-medium eb:transition-colors eb:outline-none eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50 eb:disabled:opacity-50",
+  selected ? "eb:border-primary eb:bg-primary eb:text-primary-foreground" : "eb:border-border eb:bg-background eb:text-foreground eb:hover:border-primary/50 eb:hover:bg-primary/5"
+);
+
+// src/ai/RewriteText.jsx
+import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function nativeName(code) {
   try {
     const name = new Intl.DisplayNames([code], { type: "language" }).of(code) || code;
@@ -882,26 +950,27 @@ function nativeName(code) {
   }
 }
 function RewriteText({ editor, selection, rewrite }) {
-  const { t, notify } = useUi();
+  const { t, locale, notify } = useUi();
   const [running, setRunning] = useState4(
     /** @type {string|null} */
     null
   );
   const [error, setError] = useState4("");
   const [instruction, setInstruction] = useState4("");
+  const [topic, setTopic] = useState4("");
   const abortRef = useRef4(
     /** @type {AbortController|null} */
     null
   );
   const label = selection.tagName === "mj-button";
   useEffect4(() => () => abortRef.current?.abort(), []);
-  const currentText = () => {
+  const currentText2 = () => {
     const element = editor.getElement(selection.id);
     return (label ? element?.content : element?.html) ?? "";
   };
   const run = async (action, extra = {}) => {
     if (running) return;
-    const text = currentText();
+    const text = currentText2();
     setError("");
     setRunning(action);
     const controller = new AbortController();
@@ -909,15 +978,18 @@ function RewriteText({ editor, selection, rewrite }) {
     try {
       const result = await rewrite({ action, text, format: label ? "plain" : "html", ...extra }, { signal: controller.signal });
       if (controller.signal.aborted) return;
-      if (currentText() !== text) {
+      if (currentText2() !== text) {
         setError(t("The text changed in the meantime, so it was left as it is."));
         return;
       }
       editor.setContent(label ? result.text : cleanRichText(result.text, document), selection.id);
       if (action === "custom") setInstruction("");
-      notify("success", t("Text rewritten. Ctrl+Z brings back the previous one."));
+      if (action === "write") setTopic("");
+      notify("success", action === "write" ? t("Text written. Ctrl+Z brings back the previous one.") : t("Text rewritten. Ctrl+Z brings back the previous one."));
     } catch (err) {
-      if (!controller.signal.aborted) setError(err?.message ? t(err.message) : t("The text could not be rewritten."));
+      if (!controller.signal.aborted) {
+        setError(err?.message ? t(err.message) : action === "write" ? t("The text could not be written.") : t("The text could not be rewritten."));
+      }
     } finally {
       if (abortRef.current === controller) abortRef.current = null;
       setRunning(null);
@@ -927,65 +999,110 @@ function RewriteText({ editor, selection, rewrite }) {
     abortRef.current?.abort();
     setRunning(null);
   };
+  const write = () => {
+    const subject = topic.trim();
+    if (!subject) return;
+    const size = Number.parseFloat(String(editor.getElement(selection.id)?.attributes?.["font-size"] || ""));
+    const own = visibleText(currentText2());
+    const words = emailWords(editor.exportMjml());
+    run("write", {
+      instruction: subject,
+      context: own ? words.replace(own, "").trim() : words,
+      role: size >= 20 ? "heading" : "text",
+      language: String(locale || "en").slice(0, 2)
+    });
+  };
   const busy = Boolean(running);
   const spinner = /* @__PURE__ */ jsx4(Loader22, { className: "eb:size-3 eb:animate-spin", "aria-hidden": "true" });
-  return /* @__PURE__ */ jsxs4("section", { className: "eb:space-y-2.5", "aria-label": t("Rewrite with AI"), "data-testid": "eb-rewrite", children: [
-    /* @__PURE__ */ jsxs4(SectionLabel, { className: "eb:flex eb:items-center eb:gap-1.5", children: [
-      /* @__PURE__ */ jsx4(Sparkles2, { className: "eb:size-3", "aria-hidden": "true" }),
-      t("Rewrite with AI")
+  return /* @__PURE__ */ jsxs4(Fragment3, { children: [
+    !label && /* @__PURE__ */ jsxs4("section", { className: "eb:space-y-2.5", "aria-label": t("Write with AI"), "data-testid": "eb-write", children: [
+      /* @__PURE__ */ jsxs4(SectionLabel, { className: "eb:flex eb:items-center eb:gap-1.5", children: [
+        /* @__PURE__ */ jsx4(PenLine, { className: "eb:size-3", "aria-hidden": "true" }),
+        t("Write with AI")
+      ] }),
+      /* @__PURE__ */ jsxs4(
+        "form",
+        {
+          className: "eb:flex eb:gap-1.5",
+          onSubmit: (event) => {
+            event.preventDefault();
+            write();
+          },
+          children: [
+            /* @__PURE__ */ jsx4(
+              Input,
+              {
+                value: topic,
+                onChange: (event) => setTopic(event.target.value),
+                maxLength: MAX_REWRITE_INSTRUCTION,
+                placeholder: t("What should it say? e.g. the sale ends Sunday"),
+                "aria-label": t("What the text is about"),
+                disabled: busy
+              }
+            ),
+            /* @__PURE__ */ jsx4(Button, { type: "submit", variant: "outline", size: "icon-sm", "aria-label": t("Write"), disabled: busy || !topic.trim(), children: running === "write" ? /* @__PURE__ */ jsx4(Loader22, { className: "eb:animate-spin" }) : /* @__PURE__ */ jsx4(PenLine, {}) })
+          ]
+        }
+      )
     ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "eb:flex eb:flex-wrap eb:gap-1.5", children: [
-      REWRITE_ACTIONS.map((action) => /* @__PURE__ */ jsxs4("button", { type: "button", className: chipClassName(), disabled: busy, onClick: () => run(action.id), children: [
-        running === action.id && spinner,
-        t(action.label)
-      ] }, action.id)),
-      /* @__PURE__ */ jsxs4(DropdownMenu, { children: [
-        /* @__PURE__ */ jsx4(DropdownMenuTrigger, { asChild: true, disabled: busy, children: /* @__PURE__ */ jsxs4("button", { type: "button", className: chipClassName(), children: [
-          running === "translate" ? spinner : /* @__PURE__ */ jsx4(Languages, { className: "eb:size-3", "aria-hidden": "true" }),
-          t("Translate"),
-          /* @__PURE__ */ jsx4(ChevronDown2, { className: "eb:size-3", "aria-hidden": "true" })
-        ] }) }),
-        /* @__PURE__ */ jsx4(DropdownMenuContent, { align: "start", "aria-label": t("Translate into"), children: REWRITE_LANGUAGES.map((code) => /* @__PURE__ */ jsx4(DropdownMenuItem, { lang: code, onSelect: () => run("translate", { targetLanguage: code }), children: nativeName(code) }, code)) })
+    /* @__PURE__ */ jsxs4("section", { className: "eb:space-y-2.5", "aria-label": t("Rewrite with AI"), "data-testid": "eb-rewrite", children: [
+      /* @__PURE__ */ jsxs4(SectionLabel, { className: "eb:flex eb:items-center eb:gap-1.5", children: [
+        /* @__PURE__ */ jsx4(Sparkles, { className: "eb:size-3", "aria-hidden": "true" }),
+        t("Rewrite with AI")
+      ] }),
+      /* @__PURE__ */ jsxs4("div", { className: "eb:flex eb:flex-wrap eb:gap-1.5", children: [
+        REWRITE_ACTIONS.map((action) => /* @__PURE__ */ jsxs4("button", { type: "button", className: chipClassName(), disabled: busy, onClick: () => run(action.id), children: [
+          running === action.id && spinner,
+          t(action.label)
+        ] }, action.id)),
+        /* @__PURE__ */ jsxs4(DropdownMenu, { children: [
+          /* @__PURE__ */ jsx4(DropdownMenuTrigger, { asChild: true, disabled: busy, children: /* @__PURE__ */ jsxs4("button", { type: "button", className: chipClassName(), children: [
+            running === "translate" ? spinner : /* @__PURE__ */ jsx4(Languages, { className: "eb:size-3", "aria-hidden": "true" }),
+            t("Translate"),
+            /* @__PURE__ */ jsx4(ChevronDown2, { className: "eb:size-3", "aria-hidden": "true" })
+          ] }) }),
+          /* @__PURE__ */ jsx4(DropdownMenuContent, { align: "start", "aria-label": t("Translate into"), children: REWRITE_LANGUAGES.map((code) => /* @__PURE__ */ jsx4(DropdownMenuItem, { lang: code, onSelect: () => run("translate", { targetLanguage: code }), children: nativeName(code) }, code)) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs4(
+        "form",
+        {
+          className: "eb:flex eb:gap-1.5",
+          onSubmit: (event) => {
+            event.preventDefault();
+            if (instruction.trim()) run("custom", { instruction: instruction.trim() });
+          },
+          children: [
+            /* @__PURE__ */ jsx4(
+              Input,
+              {
+                value: instruction,
+                onChange: (event) => setInstruction(event.target.value),
+                maxLength: MAX_REWRITE_INSTRUCTION,
+                placeholder: t("Or say what to change\u2026"),
+                "aria-label": t("What to change"),
+                disabled: busy
+              }
+            ),
+            /* @__PURE__ */ jsx4(Button, { type: "submit", variant: "outline", size: "icon-sm", "aria-label": t("Rewrite"), disabled: busy || !instruction.trim(), children: running === "custom" ? /* @__PURE__ */ jsx4(Loader22, { className: "eb:animate-spin" }) : /* @__PURE__ */ jsx4(Sparkles, {}) })
+          ]
+        }
+      ),
+      running && /* @__PURE__ */ jsxs4("p", { className: "eb:flex eb:items-center eb:gap-2 eb:text-[12px] eb:text-foreground-muted", role: "status", "aria-live": "polite", children: [
+        running === "write" ? t("Writing\u2026") : t("Rewriting\u2026"),
+        /* @__PURE__ */ jsx4(Button, { type: "button", variant: "link", size: "xs", className: "eb:h-auto eb:px-0", onClick: cancel, children: t("Cancel") })
+      ] }),
+      error && /* @__PURE__ */ jsxs4("p", { role: "alert", className: "eb:flex eb:items-start eb:gap-1.5 eb:text-[12px] eb:text-destructive", children: [
+        /* @__PURE__ */ jsx4(TriangleAlert3, { className: "eb:mt-px eb:size-3.5 eb:shrink-0", "aria-hidden": "true" }),
+        error
       ] })
-    ] }),
-    /* @__PURE__ */ jsxs4(
-      "form",
-      {
-        className: "eb:flex eb:gap-1.5",
-        onSubmit: (event) => {
-          event.preventDefault();
-          if (instruction.trim()) run("custom", { instruction: instruction.trim() });
-        },
-        children: [
-          /* @__PURE__ */ jsx4(
-            Input,
-            {
-              value: instruction,
-              onChange: (event) => setInstruction(event.target.value),
-              maxLength: MAX_REWRITE_INSTRUCTION,
-              placeholder: t("Or say what to change\u2026"),
-              "aria-label": t("What to change"),
-              disabled: busy
-            }
-          ),
-          /* @__PURE__ */ jsx4(Button, { type: "submit", variant: "outline", size: "icon-sm", "aria-label": t("Rewrite"), disabled: busy || !instruction.trim(), children: running === "custom" ? /* @__PURE__ */ jsx4(Loader22, { className: "eb:animate-spin" }) : /* @__PURE__ */ jsx4(Sparkles2, {}) })
-        ]
-      }
-    ),
-    running && /* @__PURE__ */ jsxs4("p", { className: "eb:flex eb:items-center eb:gap-2 eb:text-[12px] eb:text-foreground-muted", role: "status", "aria-live": "polite", children: [
-      t("Rewriting\u2026"),
-      /* @__PURE__ */ jsx4(Button, { type: "button", variant: "link", size: "xs", className: "eb:h-auto eb:px-0", onClick: cancel, children: t("Cancel") })
-    ] }),
-    error && /* @__PURE__ */ jsxs4("p", { role: "alert", className: "eb:flex eb:items-start eb:gap-1.5 eb:text-[12px] eb:text-destructive", children: [
-      /* @__PURE__ */ jsx4(TriangleAlert3, { className: "eb:mt-px eb:size-3.5 eb:shrink-0", "aria-hidden": "true" }),
-      error
     ] })
   ] });
 }
 
 // src/ai/SubjectIdeas.jsx
 import { useEffect as useEffect5, useLayoutEffect, useRef as useRef5, useState as useState5 } from "react";
-import { Check as Check3, Loader2 as Loader23, Sparkles as Sparkles3, TriangleAlert as TriangleAlert4 } from "lucide-react";
+import { Check as Check3, Loader2 as Loader23, Sparkles as Sparkles2, TriangleAlert as TriangleAlert4 } from "lucide-react";
 import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var MAX_AVOID = 12;
 function SubjectIdeas({ editor, meta, onSubject, suggest, variables = null }) {
@@ -1104,7 +1221,7 @@ function SubjectIdeas({ editor, meta, onSubject, suggest, variables = null }) {
   const spinner = /* @__PURE__ */ jsx5(Loader23, { className: "eb:size-3 eb:animate-spin", "aria-hidden": "true" });
   return /* @__PURE__ */ jsxs5("div", { className: "eb:space-y-2", "data-testid": "eb-subject-ideas", ref: rootRef, children: [
     !ideas && /* @__PURE__ */ jsxs5("button", { type: "button", className: chipClassName(), disabled: running || !ready, onClick: run, "data-subject-ideas-button": true, children: [
-      running ? spinner : /* @__PURE__ */ jsx5(Sparkles3, { className: "eb:size-3", "aria-hidden": "true" }),
+      running ? spinner : /* @__PURE__ */ jsx5(Sparkles2, { className: "eb:size-3", "aria-hidden": "true" }),
       t("Suggest subjects")
     ] }),
     ideas && /* @__PURE__ */ jsxs5("div", { className: "eb:space-y-2 eb:rounded-md eb:border eb:border-border eb:p-1.5", children: [
@@ -1133,7 +1250,7 @@ function SubjectIdeas({ editor, meta, onSubject, suggest, variables = null }) {
       }) }),
       /* @__PURE__ */ jsxs5("div", { className: "eb:flex eb:items-center eb:gap-1.5 eb:px-1 eb:pb-0.5", children: [
         /* @__PURE__ */ jsxs5("button", { type: "button", className: chipClassName(), disabled: running || !ready, onClick: run, "data-subject-ideas-button": true, children: [
-          running ? spinner : /* @__PURE__ */ jsx5(Sparkles3, { className: "eb:size-3", "aria-hidden": "true" }),
+          running ? spinner : /* @__PURE__ */ jsx5(Sparkles2, { className: "eb:size-3", "aria-hidden": "true" }),
           t("More ideas")
         ] }),
         /* @__PURE__ */ jsx5(Button, { type: "button", variant: "ghost", size: "xs", className: "eb:ml-auto", disabled: running, onClick: done, children: t("Done") })
@@ -1153,12 +1270,12 @@ function SubjectIdeas({ editor, meta, onSubject, suggest, variables = null }) {
 // src/ai/createAi.js
 var PARTS = (
   /** @type {const} */
-  ["generate", "rewrite", "suggestSubjects"]
+  ["proofread", "rewrite", "suggestSubjects"]
 );
-var ROUTES = { generate: "/generate", rewrite: "/rewrite", suggestSubjects: "/subjects" };
+var ROUTES = { proofread: "/proofread", rewrite: "/rewrite", suggestSubjects: "/subjects" };
 function createAi(options = {}) {
   if (!options || typeof options !== "object") throw new TypeError("createAi: options must be an object");
-  const { model, maxAttempts, compile, baseUrl, headers, fetch: fetchImpl, provider: providerOption, apiKey, askKey = false } = options;
+  const { model, maxAttempts, baseUrl, headers, fetch: fetchImpl, provider: providerOption, apiKey, askKey = false } = options;
   const usesProvider = providerOption !== void 0;
   const http = baseUrl !== void 0 || headers !== void 0 || fetchImpl !== void 0 && !usesProvider;
   if (model !== void 0 && typeof model !== "function") throw new TypeError("createAi: `model` must be a function");
@@ -1170,8 +1287,12 @@ function createAi(options = {}) {
     throw new TypeError('createAi: `apiKey` and `askKey` go with a `provider` (e.g. provider: "openrouter")');
   }
   if (apiKey !== void 0 && (typeof apiKey !== "string" || !apiKey)) throw new TypeError("createAi: `apiKey` must be a non-empty string");
-  if (compile !== void 0 && (typeof compile !== "function" || !model && !usesProvider)) {
-    throw new TypeError("createAi: `compile` must be a function, and goes with `provider` or `model` (the AI in the page)");
+  const { generate } = (
+    /** @type {any} */
+    options
+  );
+  if (generate !== void 0 && generate !== false) {
+    throw new TypeError("createAi: `generate` was removed in 0.10 \u2014 the AI checks and writes the texts of an email (`proofread`, `rewrite`), not whole emails");
   }
   if (typeof askKey !== "boolean") throw new TypeError("createAi: `askKey` must be true or false");
   if (apiKey && askKey) throw new TypeError("createAi: `apiKey` (one key for all) or `askKey` (each user's own), not both");
@@ -1203,12 +1324,14 @@ function createAi(options = {}) {
         providers.find((item) => item.id === id)
       );
       const name = key ? key.model(id) : chosen.model;
+      const address = key && key.providers.find((item) => item.id === id)?.needsAddress ? key.address(id) : "";
       const slot = `${id}
-${name}`;
+${name}
+${address}`;
       if (!models.has(slot)) {
         models.set(
           slot,
-          chosen.createModel ? chosen.createModel({ apiKey: keyFor, fetch: fetchImpl, ...name ? { model: name } : {} }) : providerEmailModel({ provider: chosen, fetch: fetchImpl, apiKey: keyFor, ...name ? { model: name } : {} })
+          chosen.createModel ? chosen.createModel({ apiKey: keyFor, fetch: fetchImpl, ...name ? { model: name } : {} }) : providerEmailModel({ provider: chosen, fetch: fetchImpl, apiKey: keyFor, ...name ? { model: name } : {}, ...address ? { baseUrl: address } : {} })
         );
       }
       return (
@@ -1217,13 +1340,16 @@ ${name}`;
       );
     };
     const model2 = async (request) => {
-      if (key && !key.get() && !providers.find((item) => item.id === key.provider.id)?.keyless) await key.request();
+      if (key && !key.ready()) {
+        await key.request();
+        if (!key.ready()) throw new EmailGenerationError("KEY_MISSING", `${key.provider.name}: not connected`);
+      }
       return modelOf(key ? key.provider.id : provider.id)(request);
     };
-    const generator = createEmailGenerator({ model: model2, maxAttempts, compile });
+    const generator = createEmailGenerator({ model: model2, maxAttempts });
     for (const part of PARTS) transport[part] = key ? askedAgain(generator[part], key) : generator[part];
   } else if (model) {
-    transport = createEmailGenerator({ model, maxAttempts, compile });
+    transport = createEmailGenerator({ model, maxAttempts });
   } else if (!ownOnly) {
     const { call } = createHttpCaller({ baseUrl, headers, fetch: fetchImpl });
     for (const part of PARTS) {
@@ -1237,9 +1363,9 @@ ${name}`;
     return transport[part] || null;
   };
   return Object.freeze({
-    generate: (
-      /** @type {GenerateFn|null} */
-      resolve("generate")
+    proofread: (
+      /** @type {ProofreadFn|null} */
+      resolve("proofread")
     ),
     rewrite: (
       /** @type {RewriteFn|null} */
@@ -1251,7 +1377,7 @@ ${name}`;
     ),
     key,
     messages: AI_MESSAGES,
-    components: Object.freeze({ Generate: GenerateButton, Rewrite: RewriteText, Subjects: SubjectIdeas, Connect: key ? ConnectAi : null })
+    components: Object.freeze({ Proofread: ProofreadButton, Rewrite: RewriteText, Subjects: SubjectIdeas, Connect: key ? ConnectAi : null })
   });
 }
 function providerOf(option) {
@@ -1295,10 +1421,8 @@ export {
   AI_MESSAGES,
   AI_PROVIDERS,
   DEFAULT_CLAUDE_MODEL,
-  EMAIL_PURPOSES,
   EmailGenerationError,
   GENERATION_ERRORS,
-  PURPOSE_CATEGORIES,
   REWRITE_ACTIONS,
   REWRITE_LANGUAGES,
   agentEmailModel,
@@ -1306,6 +1430,7 @@ export {
   claudeProvider,
   createAi,
   createEmailGenerator,
+  diffWords,
   emailWords,
   failureCode,
   listProviderModels,