best-email-builder 0.8.0 → 0.9.0

package/CHANGELOG.md

@@ -6,6 +6,27 @@ All notable changes are documented here. The format follows
 
 ## [Unreleased]
 
+## [0.9.0] — 2026-10-16
+
+### Added
+- **An OpenAI-compatible API of the user's own** in the Connect dialog: add
+  `'openai-compatible'` to `createAi({ provider: [...], askKey: true })`
+  and the user gives its address (LM Studio, vLLM, Ollama on another
+  machine, a proxy…), a key only if it needs one, and a model from its
+  `/models` list. The address is remembered like the key. `ai.key` gains
+  `address(id?)`, `setAddress(url, id?)` and `ready()`; `listModels` takes
+  an `address`. A provider without a key of its own (Ollama) connects
+  without one, once a model is chosen.
+- The live demo offers it too, and its language list is now a list of its
+  own instead of the browser's: by mouse, or by keyboard (arrows, Home/End,
+  type a letter, Enter, Esc).
+
+### Changed
+- The Connect dialog and the list of models show what is free in words
+  only: no gift icons.
+- `ai.key.state().connected` is true once the provider in use can write:
+  its key (unless it needs none), its address and its model.
+
 ## [0.8.0] — 2026-10-16
 
 ### Added

package/README.md

@@ -69,9 +69,9 @@ once and given away.
 - *Rewrite* any text: shorter, longer, fixed, friendlier, more formal, or
   translated into 13 languages.
 - *Suggest* three subject lines drawn from the email.
-- OpenRouter, Gemini, Groq, Mistral, OpenAI, DeepSeek, Cerebras, Ollama,
-  Claude or your own agent. The model runs on your server, or in the page
-  with each user's own key.
+- OpenRouter, Gemini, Groq, Mistral, OpenAI, DeepSeek, Cerebras, Ollama, any
+  OpenAI-compatible API, Claude or your own agent. The model runs on your
+  server, or in the page with each user's own key.
 
 **Your app**
 - Merge-tag variables, including ones your users create.

package/dist/ai-server.js

@@ -34,7 +34,7 @@ import {
   reviewDraft,
   reviewRewrite,
   reviewSubjects
-} from "./chunk-SHHHYRPC.js";
+} from "./chunk-VJKF6SR4.js";
 import "./chunk-OWVXKMLI.js";
 import "./chunk-AXIM6E7T.js";
 import "./chunk-62HBUBBI.js";

package/dist/ai.js

@@ -23,8 +23,8 @@ import {
   createHttpCaller,
   useSearchShortcut,
   useUi
-} from "./chunk-DXWIVGHP.js";
-import "./chunk-FAEVYSIF.js";
+} from "./chunk-D4JBPAJ5.js";
+import "./chunk-4IXP5YVN.js";
 import {
   AGENT_ERROR_CODES,
   AGENT_PROTOCOL,
@@ -49,7 +49,7 @@ import {
   providerEmailModel,
   purposesByCategory,
   resolveProvider
-} from "./chunk-SHHHYRPC.js";
+} from "./chunk-VJKF6SR4.js";
 import "./chunk-OWVXKMLI.js";
 import "./chunk-AXIM6E7T.js";
 import {
@@ -61,6 +61,7 @@ import {
 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 +77,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 +121,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 +173,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 +205,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 +232,7 @@ ${key}`;
       return () => listeners.delete(listener);
     },
     state: () => snapshot,
-    answer: (key) => answer(key || ""),
+    answer: (key) => answer(key ?? null),
     refuse: () => {
       keep(current, "");
       refused = true;
@@ -211,16 +243,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 +271,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 +291,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 +341,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 +350,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 +413,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 +491,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 +508,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 +537,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 +570,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 +583,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 +612,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 +644,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 +703,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,11 +722,11 @@ 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") })
         ] })
       ] })
     }
@@ -1203,12 +1268,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,7 +1284,10 @@ ${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 });