@bobfrankston/mailx 1.0.101 → 1.0.102

package/client/app.js

@@ -809,6 +809,23 @@ optEditorTiptap?.addEventListener("change", () => {
     if (optEditorTiptap.checked)
         saveEditorSetting("tiptap");
 });
+// ── AI autocomplete toggle ──
+const optAutocomplete = document.getElementById("opt-autocomplete");
+// Load current autocomplete setting
+fetch("/api/autocomplete/settings").then(r => r.json()).then(ac => {
+    if (optAutocomplete)
+        optAutocomplete.checked = ac.enabled || false;
+}).catch(() => { });
+optAutocomplete?.addEventListener("change", () => {
+    fetch("/api/autocomplete/settings").then(r => r.json()).then(ac => {
+        ac.enabled = optAutocomplete.checked;
+        fetch("/api/autocomplete/settings", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(ac),
+        });
+    }).catch(() => { });
+});
 const isApp = typeof mailxapi !== "undefined" && mailxapi?.isApp;
 fetch("/api/version").then(r => r.json()).then(d => {
     const el = document.getElementById("app-version");

package/client/compose/compose.css

@@ -261,3 +261,19 @@ body {
     margin-top: var(--gap-md);
     color: var(--color-text-muted);
 }
+
+/* Ghost text autocomplete overlay */
+.ghost-text {
+    position: absolute;
+    color: var(--color-text-muted);
+    font-style: italic;
+    opacity: 0.5;
+    pointer-events: none;
+    white-space: pre-wrap;
+    z-index: 10;
+    font-family: inherit;
+    font-size: inherit;
+    line-height: inherit;
+    max-width: 60ch;
+}
+.ql-editor, .tt-content .tiptap { position: relative; }

package/client/compose/compose.js

@@ -41,14 +41,15 @@ async function loadEditorAssets(type) {
 }
 // ── Determine editor type from settings ──
 let editorType = "quill";
+let appSettings = null;
 try {
     const res = await fetch("/api/version");
     if (res.ok) {
         // Check settings for editor preference
         const settingsRes = await fetch("/api/settings");
         if (settingsRes.ok) {
-            const settings = await settingsRes.json();
-            if (settings.ui?.editor === "tiptap")
+            appSettings = await settingsRes.json();
+            if (appSettings.ui?.editor === "tiptap")
                 editorType = "tiptap";
         }
     }
@@ -65,6 +66,15 @@ const toInput = document.getElementById("compose-to");
 const ccInput = document.getElementById("compose-cc");
 const bccInput = document.getElementById("compose-bcc");
 const subjectInput = document.getElementById("compose-subject");
+// ── AI ghost text autocomplete ──
+if (appSettings?.autocomplete?.enabled && appSettings.autocomplete.provider !== "off") {
+    import("./ghost-text.js").then(({ initGhostText }) => {
+        initGhostText(editor, {
+            getSubject: () => subjectInput.value,
+            getTo: () => toInput.value,
+        }, { debounceMs: appSettings.autocomplete.debounceMs || 600 });
+    }).catch(() => { });
+}
 /** Populate the From dropdown with accounts */
 function populateFromSelect(accounts, selectedId) {
     fromSelect.innerHTML = "";

package/client/compose/editor.js

@@ -34,7 +34,21 @@ function createQuillEditor(container) {
         setCursor(pos) {
             q.setSelection(pos, 0);
         },
-        root: q.root
+        root: q.root,
+        getScrollContainer() {
+            return q.root;
+        },
+        onContentChange(handler) {
+            q.on("text-change", handler);
+        },
+        onKeyDown(handler) {
+            q.root.addEventListener("keydown", handler);
+        },
+        insertTextAtCursor(text) {
+            const sel = q.getSelection();
+            if (sel)
+                q.insertText(sel.index, text);
+        }
     };
 }
 // ── tiptap ──
@@ -147,7 +161,19 @@ async function createTiptapEditor(container) {
         setCursor(pos) {
             ed.commands.focus("start");
         },
-        root: editorEl
+        root: editorEl,
+        getScrollContainer() {
+            return editorEl;
+        },
+        onContentChange(handler) {
+            ed.on("update", handler);
+        },
+        onKeyDown(handler) {
+            editorEl.addEventListener("keydown", handler);
+        },
+        insertTextAtCursor(text) {
+            ed.commands.insertContent(text);
+        }
     };
 }
 // ── Factory ──

package/client/compose/ghost-text.js

@@ -0,0 +1,122 @@
+/**
+ * Ghost text autocomplete — shows AI suggestions as translucent overlay at cursor.
+ * Tab accepts, Escape dismisses, any other key dismisses and re-triggers after debounce.
+ * Editor-agnostic: works with both Quill and tiptap via MailxEditor interface.
+ */
+import { autocomplete } from "../lib/api-client.js";
+let ghostEl = null;
+let currentSuggestion = null;
+let debounceTimer = null;
+let abortController = null;
+let activeEditor = null;
+let debounceMs = 600;
+function dismiss() {
+    currentSuggestion = null;
+    if (ghostEl) {
+        ghostEl.remove();
+        ghostEl = null;
+    }
+}
+function positionGhost(editor, text) {
+    dismiss();
+    const sel = window.getSelection();
+    if (!sel || sel.rangeCount === 0 || !sel.isCollapsed)
+        return;
+    const range = sel.getRangeAt(0);
+    let rect = range.getBoundingClientRect();
+    // Collapsed range may return zero-width rect — use a temp span to measure
+    if (rect.width === 0 && rect.height === 0) {
+        const span = document.createElement("span");
+        span.textContent = "\u200B"; // zero-width space
+        range.insertNode(span);
+        rect = span.getBoundingClientRect();
+        span.remove();
+        // Restore selection
+        sel.removeAllRanges();
+        sel.addRange(range);
+    }
+    const container = editor.getScrollContainer();
+    const containerRect = container.getBoundingClientRect();
+    ghostEl = document.createElement("span");
+    ghostEl.className = "ghost-text";
+    ghostEl.textContent = text;
+    ghostEl.style.top = `${rect.top - containerRect.top + container.scrollTop}px`;
+    ghostEl.style.left = `${rect.left - containerRect.left + container.scrollLeft}px`;
+    container.appendChild(ghostEl);
+    currentSuggestion = text;
+}
+function requestSuggestion(editor, context) {
+    // Cancel any in-flight request
+    if (abortController) {
+        abortController.abort();
+        abortController = null;
+    }
+    const bodyText = editor.getText();
+    if (!bodyText || bodyText.trim().length < 10)
+        return; // too short to suggest
+    abortController = new AbortController();
+    const signal = abortController.signal;
+    autocomplete({
+        subject: context.getSubject(),
+        to: context.getTo(),
+        bodyText,
+        cursorOffset: bodyText.length,
+    }, signal).then((result) => {
+        if (signal.aborted)
+            return;
+        if (result.suggestion) {
+            positionGhost(editor, result.suggestion);
+        }
+    }).catch((e) => {
+        if (e.name === "AbortError")
+            return;
+        // Silently ignore autocomplete errors
+    });
+}
+export function initGhostText(editor, context, options) {
+    activeEditor = editor;
+    if (options?.debounceMs)
+        debounceMs = options.debounceMs;
+    // Debounced content change → request suggestion
+    editor.onContentChange(() => {
+        dismiss();
+        if (debounceTimer)
+            clearTimeout(debounceTimer);
+        debounceTimer = setTimeout(() => {
+            requestSuggestion(editor, context);
+        }, debounceMs);
+    });
+    // Key handler: Tab accepts, Escape dismisses
+    editor.onKeyDown((e) => {
+        if (!currentSuggestion)
+            return;
+        if (e.key === "Tab") {
+            e.preventDefault();
+            e.stopPropagation();
+            const text = currentSuggestion;
+            dismiss();
+            editor.insertTextAtCursor(text);
+            return;
+        }
+        if (e.key === "Escape") {
+            e.preventDefault();
+            e.stopPropagation();
+            dismiss();
+            return;
+        }
+        // Any other key: dismiss (new suggestion will come after debounce)
+        dismiss();
+    });
+    // Dismiss on blur/scroll
+    editor.root.addEventListener("blur", dismiss);
+    editor.getScrollContainer().addEventListener("scroll", dismiss);
+}
+export function destroyGhostText() {
+    dismiss();
+    if (debounceTimer)
+        clearTimeout(debounceTimer);
+    if (abortController)
+        abortController.abort();
+    activeEditor = null;
+}
+//# sourceMappingURL=ghost-text.js.map

package/client/index.html

@@ -34,6 +34,8 @@
                     <span class="tb-menu-label">Editor</span>
                     <label class="tb-menu-item"><input type="radio" name="opt-editor" value="quill" id="opt-editor-quill" checked> Quill</label>
                     <label class="tb-menu-item"><input type="radio" name="opt-editor" value="tiptap" id="opt-editor-tiptap"> tiptap</label>
+                    <hr class="tb-menu-sep">
+                    <label class="tb-menu-item"><input type="checkbox" id="opt-autocomplete"> AI autocomplete</label>
                 </div>
             </div>
             <span id="app-version" class="app-version"></span>

package/client/lib/api-client.js

@@ -222,6 +222,18 @@ export function connectEvents() {
         };
     }
 }
+// ── Autocomplete ──
+export function autocomplete(body, signal) {
+    if (hasIPC)
+        return mailxapi.autocomplete?.(body);
+    return api("/autocomplete", { method: "POST", body: JSON.stringify(body), signal });
+}
+export function getAutocompleteSettings() {
+    return api("/autocomplete/settings");
+}
+export function saveAutocompleteSettings(settings) {
+    return api("/autocomplete/settings", { method: "POST", body: JSON.stringify(settings) });
+}
 // Legacy exports for backward compatibility
 export const connectWebSocket = connectEvents;
 export const onWsEvent = onEvent;

package/client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobfrankston/mailx-client",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "private": true,
   "type": "module",
   "dependencies": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobfrankston/mailx",
-  "version": "1.0.101",
+  "version": "1.0.102",
   "description": "Local-first email client with IMAP sync and standalone native app",
   "type": "module",
   "main": "bin/mailx.js",

package/packages/mailx-api/index.js

@@ -84,6 +84,27 @@ export function createApiRouter(db, imapManager) {
             res.status(500).json({ error: e.message });
         }
     });
+    // ── Autocomplete ──
+    router.post("/autocomplete", async (req, res) => {
+        try {
+            res.json(await svc.autocomplete(req.body));
+        }
+        catch (e) {
+            res.status(500).json({ error: e.message, suggestion: "" });
+        }
+    });
+    router.get("/autocomplete/settings", (req, res) => {
+        res.json(svc.getAutocompleteSettings());
+    });
+    router.post("/autocomplete/settings", (req, res) => {
+        try {
+            svc.saveAutocompleteSettings(req.body);
+            res.json({ ok: true });
+        }
+        catch (e) {
+            res.status(500).json({ error: e.message });
+        }
+    });
     // ── Send ──
     router.post("/send", async (req, res) => {
         try {

package/packages/mailx-api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobfrankston/mailx-api",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "type": "module",
   "main": "index.js",
   "types": "index.d.ts",

package/packages/mailx-service/index.d.ts

@@ -5,7 +5,7 @@
  */
 import { MailxDB } from "@bobfrankston/mailx-store";
 import { ImapManager } from "@bobfrankston/mailx-imap";
-import type { Folder } from "@bobfrankston/mailx-types";
+import type { Folder, AutocompleteRequest, AutocompleteResponse, AutocompleteSettings } from "@bobfrankston/mailx-types";
 export declare function sanitizeHtml(html: string): {
     html: string;
     hasRemoteContent: boolean;
@@ -56,5 +56,8 @@ export declare class MailxService {
         provider: string;
         mode: string;
     };
+    getAutocompleteSettings(): AutocompleteSettings;
+    saveAutocompleteSettings(settings: AutocompleteSettings): void;
+    autocomplete(req: AutocompleteRequest): Promise<AutocompleteResponse>;
 }
 //# sourceMappingURL=index.d.ts.map

package/packages/mailx-service/index.js

@@ -3,7 +3,7 @@
  * Pure business logic — no HTTP, no Express.
  * Both the Express API (mailx-api) and the Android bridge call these functions.
  */
-import { loadSettings, saveSettings, loadAllowlist, saveAllowlist, getStorePath, getStorageInfo } from "@bobfrankston/mailx-settings";
+import { loadSettings, saveSettings, loadAllowlist, saveAllowlist, loadAutocomplete, saveAutocomplete, getStorePath, getStorageInfo } from "@bobfrankston/mailx-settings";
 import { simpleParser } from "mailparser";
 // ── Sanitize ──
 export function sanitizeHtml(html) {
@@ -466,5 +466,98 @@ export class MailxService {
     getStorageInfo() {
         return getStorageInfo();
     }
+    // ── Autocomplete ──
+    getAutocompleteSettings() {
+        return loadAutocomplete();
+    }
+    saveAutocompleteSettings(settings) {
+        saveAutocomplete(settings);
+    }
+    async autocomplete(req) {
+        const acConfig = loadAutocomplete();
+        if (!acConfig.enabled || acConfig.provider === "off") {
+            return { suggestion: "" };
+        }
+        const bodyText = req.bodyText || "";
+        const prompt = `You are an email writing assistant. Complete the following email naturally.\nOutput ONLY the completion text — no explanation, no greeting repeat.\nKeep it to 1-2 sentences max.\n\nTo: ${req.to || ""}\nSubject: ${req.subject || ""}\n\n${bodyText}`;
+        try {
+            if (acConfig.provider === "ollama") {
+                const truncated = bodyText.slice(-500);
+                const ollamaPrompt = prompt.replace(bodyText, truncated);
+                const res = await fetch(`${acConfig.ollamaUrl}/api/generate`, {
+                    method: "POST",
+                    headers: { "Content-Type": "application/json" },
+                    body: JSON.stringify({
+                        model: acConfig.ollamaModel,
+                        prompt: ollamaPrompt,
+                        stream: false,
+                        options: { num_predict: acConfig.maxTokens },
+                    }),
+                });
+                if (!res.ok)
+                    return { suggestion: "" };
+                const data = await res.json();
+                return { suggestion: trimSuggestion(data.response || "") };
+            }
+            if (acConfig.provider === "claude") {
+                const res = await fetch("https://api.anthropic.com/v1/messages", {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                        "x-api-key": acConfig.cloudApiKey,
+                        "anthropic-version": "2023-06-01",
+                    },
+                    body: JSON.stringify({
+                        model: acConfig.cloudModel,
+                        max_tokens: acConfig.maxTokens,
+                        messages: [{ role: "user", content: prompt }],
+                    }),
+                });
+                if (!res.ok)
+                    return { suggestion: "" };
+                const data = await res.json();
+                const text = data.content?.[0]?.text || "";
+                return { suggestion: trimSuggestion(text) };
+            }
+            if (acConfig.provider === "openai") {
+                const res = await fetch("https://api.openai.com/v1/chat/completions", {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                        "Authorization": `Bearer ${acConfig.cloudApiKey}`,
+                    },
+                    body: JSON.stringify({
+                        model: acConfig.cloudModel,
+                        max_tokens: acConfig.maxTokens,
+                        messages: [
+                            { role: "system", content: "You are an email writing assistant. Output ONLY the completion text." },
+                            { role: "user", content: prompt },
+                        ],
+                    }),
+                });
+                if (!res.ok)
+                    return { suggestion: "" };
+                const data = await res.json();
+                const text = data.choices?.[0]?.message?.content || "";
+                return { suggestion: trimSuggestion(text) };
+            }
+        }
+        catch (e) {
+            console.error(`  [autocomplete] ${acConfig.provider} error: ${e.message}`);
+        }
+        return { suggestion: "" };
+    }
+}
+/** Trim suggestion: remove leading/trailing whitespace, cap at sentence boundary */
+function trimSuggestion(text) {
+    let s = text.trim();
+    if (!s)
+        return "";
+    // Cap at 2 sentences
+    const sentences = s.match(/[^.!?]*[.!?]/g);
+    if (sentences && sentences.length > 2) {
+        s = sentences.slice(0, 2).join("").trim();
+    }
+    return s;
 }
 //# sourceMappingURL=index.js.map

package/packages/mailx-service/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bobfrankston/mailx-service",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "type": "module",
   "main": "index.js",
   "types": "index.d.ts",

package/packages/mailx-settings/index.d.ts

@@ -15,7 +15,7 @@
  *
  * The old settings.jsonc is still supported for backward compatibility.
  */
-import type { MailxSettings, AccountConfig } from "@bobfrankston/mailx-types";
+import type { MailxSettings, AccountConfig, AutocompleteSettings } from "@bobfrankston/mailx-types";
 declare const LOCAL_DIR: string;
 declare function getSharedDir(): string;
 /** Read a file via cloud API (when filesystem mount not available) */
@@ -41,7 +41,18 @@ declare const DEFAULT_PREFERENCES: {
         intervalMinutes: number;
         historyDays: number;
     };
+    autocomplete: {
+        enabled: boolean;
+        provider: "ollama";
+        ollamaUrl: string;
+        ollamaModel: string;
+        cloudApiKey: string;
+        cloudModel: string;
+        debounceMs: number;
+        maxTokens: number;
+    };
 };
+declare const DEFAULT_AUTOCOMPLETE: AutocompleteSettings;
 declare const DEFAULT_ALLOWLIST: {
     senders: string[];
     domains: string[];
@@ -54,7 +65,11 @@ export declare function saveAccounts(accounts: AccountConfig[]): void;
 /** Load preferences (shared + local overrides, with legacy fallback) */
 export declare function loadPreferences(): typeof DEFAULT_PREFERENCES;
 /** Save preferences */
-export declare function savePreferences(prefs: typeof DEFAULT_PREFERENCES): void;
+export declare function savePreferences(prefs: any): void;
+/** Load autocomplete settings */
+export declare function loadAutocomplete(): AutocompleteSettings;
+/** Save autocomplete settings */
+export declare function saveAutocomplete(settings: AutocompleteSettings): void;
 /** Load remote content allow-list */
 export declare function loadAllowlist(): typeof DEFAULT_ALLOWLIST;
 /** Save allow-list */
@@ -74,5 +89,5 @@ export declare function initLocalConfig(sharedDir?: string, storePath?: string):
 declare const DEFAULT_SETTINGS: MailxSettings;
 /** Get historyDays for an account: per-account override > system override > shared default */
 export declare function getHistoryDays(accountId?: string): number;
-export { DEFAULT_SETTINGS, DEFAULT_ALLOWLIST, DEFAULT_PREFERENCES, LOCAL_DIR };
+export { DEFAULT_SETTINGS, DEFAULT_ALLOWLIST, DEFAULT_PREFERENCES, DEFAULT_AUTOCOMPLETE, LOCAL_DIR };
 //# sourceMappingURL=index.d.ts.map

package/packages/mailx-settings/index.js

@@ -319,6 +319,26 @@ const DEFAULT_PREFERENCES = {
         intervalMinutes: 5,
         historyDays: 30,
     },
+    autocomplete: {
+        enabled: false,
+        provider: "ollama",
+        ollamaUrl: "http://localhost:11434",
+        ollamaModel: "qwen2.5-coder:1.5b",
+        cloudApiKey: "",
+        cloudModel: "claude-sonnet-4-20250514",
+        debounceMs: 600,
+        maxTokens: 60,
+    },
+};
+const DEFAULT_AUTOCOMPLETE = {
+    enabled: false,
+    provider: "ollama",
+    ollamaUrl: "http://localhost:11434",
+    ollamaModel: "qwen2.5-coder:1.5b",
+    cloudApiKey: "",
+    cloudModel: "claude-sonnet-4-20250514",
+    debounceMs: 600,
+    maxTokens: 60,
 };
 const DEFAULT_ALLOWLIST = {
     senders: [],
@@ -391,12 +411,24 @@ export function loadPreferences() {
     return {
         ui: { ...DEFAULT_PREFERENCES.ui, ...shared.ui },
         sync: { ...DEFAULT_PREFERENCES.sync, ...shared.sync },
+        autocomplete: { ...DEFAULT_AUTOCOMPLETE, ...shared.autocomplete },
     };
 }
 /** Save preferences */
 export function savePreferences(prefs) {
     saveFile("preferences.jsonc", prefs);
 }
+/** Load autocomplete settings */
+export function loadAutocomplete() {
+    const prefs = loadPreferences();
+    return prefs.autocomplete;
+}
+/** Save autocomplete settings */
+export function saveAutocomplete(settings) {
+    const prefs = loadPreferences();
+    prefs.autocomplete = settings;
+    savePreferences(prefs);
+}
 /** Load remote content allow-list */
 export function loadAllowlist() {
     return loadFile("allowlist.jsonc", DEFAULT_ALLOWLIST);
@@ -426,6 +458,7 @@ export function loadSettings() {
         accounts,
         ui: prefs.ui,
         sync: prefs.sync,
+        autocomplete: prefs.autocomplete,
         store: {
             basePath: localConfig.storePath || DEFAULT_STORE_PATH,
             compressionBoundaryDays: 365,
@@ -512,6 +545,7 @@ const DEFAULT_SETTINGS = {
     accounts: [],
     ui: DEFAULT_PREFERENCES.ui,
     sync: DEFAULT_PREFERENCES.sync,
+    autocomplete: DEFAULT_AUTOCOMPLETE,
     store: { basePath: DEFAULT_STORE_PATH, compressionBoundaryDays: 365 },
 };
 /** Get historyDays for an account: per-account override > system override > shared default */
@@ -525,5 +559,5 @@ export function getHistoryDays(accountId) {
     const prefs = loadPreferences();
     return prefs.sync.historyDays || 0;
 }
-export { DEFAULT_SETTINGS, DEFAULT_ALLOWLIST, DEFAULT_PREFERENCES, LOCAL_DIR };
+export { DEFAULT_SETTINGS, DEFAULT_ALLOWLIST, DEFAULT_PREFERENCES, DEFAULT_AUTOCOMPLETE, LOCAL_DIR };
 //# sourceMappingURL=index.js.map

package/packages/mailx-types/index.d.ts

@@ -196,6 +196,26 @@ export interface MailxSettings {
         basePath: string; /** Where message bodies are stored */
         compressionBoundaryDays: number; /** Messages older than this get compressed */
     };
+    autocomplete?: AutocompleteSettings;
+}
+export interface AutocompleteSettings {
+    enabled: boolean;
+    provider: "ollama" | "claude" | "openai" | "off";
+    ollamaUrl: string;
+    ollamaModel: string;
+    cloudApiKey: string;
+    cloudModel: string;
+    debounceMs: number;
+    maxTokens: number;
+}
+export interface AutocompleteRequest {
+    subject: string;
+    to: string;
+    bodyText: string;
+    cursorOffset: number;
+}
+export interface AutocompleteResponse {
+    suggestion: string;
 }
 /** Body storage backend interface -- implementations are swappable */
 export interface MessageStore {