mindcache 3.6.0 → 3.7.0

package/dist/index.js

@@ -8,7 +8,9 @@ var yIndexeddb = require('y-indexeddb');
 var diff = require('fast-diff');
 var ai = require('ai');
 var zod = require('zod');
-var react = require('react');
+var React2 = require('react');
+var openai = require('@ai-sdk/openai');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -35,6 +37,7 @@ var encoding__namespace = /*#__PURE__*/_interopNamespace(encoding);
 var decoding__namespace = /*#__PURE__*/_interopNamespace(decoding);
 var Y__namespace = /*#__PURE__*/_interopNamespace(Y);
 var diff__default = /*#__PURE__*/_interopDefault(diff);
+var React2__default = /*#__PURE__*/_interopDefault(React2);
 
 var __defProp = Object.defineProperty;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -3400,11 +3403,11 @@ function createOAuthClient(config) {
 // src/local/index.ts
 init_IndexedDBAdapter();
 function useMindCache(options) {
-  const [isLoaded, setIsLoaded] = react.useState(false);
-  const [error, setError] = react.useState(null);
-  const mindcacheRef = react.useRef(null);
-  const initializingRef = react.useRef(false);
-  react.useEffect(() => {
+  const [isLoaded, setIsLoaded] = React2.useState(false);
+  const [error, setError] = React2.useState(null);
+  const mindcacheRef = React2.useRef(null);
+  const initializingRef = React2.useRef(false);
+  React2.useEffect(() => {
     if (initializingRef.current) {
       return;
     }
@@ -3433,17 +3436,1029 @@ function useMindCache(options) {
     error
   };
 }
+function createModel(provider, model, apiKey) {
+  switch (provider) {
+    case "openai": {
+      const openai$1 = openai.createOpenAI({ apiKey });
+      return openai$1(model);
+    }
+    case "anthropic":
+      throw new Error("Anthropic provider not yet implemented. Use modelProvider for custom providers.");
+    default:
+      throw new Error(`Unknown provider: ${provider}. Use modelProvider for custom providers.`);
+  }
+}
+var MindCacheContext = React2.createContext(null);
+function useMindCacheContext() {
+  const context = React2.useContext(MindCacheContext);
+  if (!context) {
+    throw new Error("useMindCacheContext must be used within a MindCacheProvider");
+  }
+  return context;
+}
+function MindCacheProvider({
+  mindcache: mcOptions,
+  sync: syncConfig,
+  ai: aiConfig = {},
+  children
+}) {
+  const [mindcache2, setMindcache] = React2.useState(null);
+  const [isLoaded, setIsLoaded] = React2.useState(false);
+  const [error, setError] = React2.useState(null);
+  const [hasApiKey, setHasApiKey] = React2.useState(false);
+  const [lastSyncAt, setLastSyncAt] = React2.useState(null);
+  const [isSyncing, setIsSyncing] = React2.useState(false);
+  const initRef = React2.useRef(false);
+  const resolvedAiConfig = {
+    provider: "openai",
+    model: "gpt-4o",
+    keyStorage: "localStorage",
+    storageKey: "ai_api_key",
+    ...aiConfig
+  };
+  React2.useEffect(() => {
+    if (initRef.current) {
+      return;
+    }
+    initRef.current = true;
+    const init = async () => {
+      try {
+        const options = mcOptions || {
+          indexedDB: {
+            dbName: "mindcache_local_first",
+            storeName: "mindcache_store",
+            debounceMs: 1e3
+          }
+        };
+        const mc = new MindCache(options);
+        await mc.waitForSync();
+        setMindcache(mc);
+        setIsLoaded(true);
+        if (resolvedAiConfig.keyStorage === "localStorage" && typeof window !== "undefined") {
+          const stored = localStorage.getItem(resolvedAiConfig.storageKey || "openai_api_key");
+          setHasApiKey(!!stored);
+        } else if (resolvedAiConfig.apiKey) {
+          setHasApiKey(true);
+        }
+      } catch (err) {
+        setError(err instanceof Error ? err : new Error(String(err)));
+        setIsLoaded(true);
+      }
+    };
+    init();
+    return () => {
+      if (mindcache2) {
+        mindcache2.disconnect();
+      }
+    };
+  }, []);
+  const getApiKey = () => {
+    if (resolvedAiConfig.apiKey) {
+      return resolvedAiConfig.apiKey;
+    }
+    if (resolvedAiConfig.keyStorage === "localStorage" && typeof window !== "undefined") {
+      return localStorage.getItem(resolvedAiConfig.storageKey || "openai_api_key");
+    }
+    return null;
+  };
+  const setApiKey = (key) => {
+    if (resolvedAiConfig.keyStorage === "localStorage" && typeof window !== "undefined") {
+      localStorage.setItem(resolvedAiConfig.storageKey || "openai_api_key", key);
+      setHasApiKey(true);
+    }
+  };
+  const getModel = () => {
+    const apiKey = getApiKey();
+    if (!apiKey) {
+      throw new Error("API key not configured. Call setApiKey() first or configure ai.apiKey.");
+    }
+    if (resolvedAiConfig.modelProvider) {
+      return resolvedAiConfig.modelProvider(apiKey);
+    }
+    const provider = resolvedAiConfig.provider || "openai";
+    const model = resolvedAiConfig.model || "gpt-4o";
+    return createModel(provider, model, apiKey);
+  };
+  const syncToGitStore = async () => {
+    if (!mindcache2 || !syncConfig?.gitstore) {
+      return;
+    }
+    setIsSyncing(true);
+    try {
+      let gitStoreModule;
+      try {
+        gitStoreModule = await Function('return import("@mindcache/gitstore")')();
+      } catch {
+        throw new Error("@mindcache/gitstore is not installed. Run: npm install @mindcache/gitstore");
+      }
+      const { GitStore, MindCacheSync } = gitStoreModule;
+      const token = typeof syncConfig.gitstore.token === "function" ? await syncConfig.gitstore.token() : syncConfig.gitstore.token;
+      const gitStore = new GitStore({
+        owner: syncConfig.gitstore.owner,
+        repo: syncConfig.gitstore.repo,
+        tokenProvider: async () => token
+      });
+      const sync = new MindCacheSync(gitStore, mindcache2, {
+        filePath: syncConfig.gitstore.path || "mindcache.md"
+      });
+      await sync.save({ message: "Auto-sync from MindCache" });
+      setLastSyncAt(/* @__PURE__ */ new Date());
+    } catch (err) {
+      console.error("[MindCacheProvider] Sync error:", err);
+      throw err;
+    } finally {
+      setIsSyncing(false);
+    }
+  };
+  const value = {
+    mindcache: mindcache2,
+    isLoaded,
+    error,
+    aiConfig: resolvedAiConfig,
+    syncConfig,
+    getApiKey,
+    setApiKey,
+    hasApiKey,
+    getModel,
+    syncToGitStore,
+    lastSyncAt,
+    isSyncing
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(MindCacheContext.Provider, { value, children });
+}
+function generateId() {
+  return Math.random().toString(36).substring(2, 15) + Date.now().toString(36);
+}
+function useClientChat(options = {}) {
+  const context = useMindCacheContext();
+  const mc = options.mindcache || context.mindcache;
+  const [messages, setMessages] = React2.useState(options.initialMessages || []);
+  const [status, setStatus] = React2.useState("idle");
+  const [error, setError] = React2.useState(null);
+  const [streamingContent, setStreamingContent] = React2.useState("");
+  const abortControllerRef = React2.useRef(null);
+  const {
+    systemPrompt,
+    onMindCacheChange,
+    onFinish,
+    onError,
+    maxToolCalls = 5
+  } = options;
+  const apiKey = context.getApiKey();
+  const addMessage = React2.useCallback((msg) => {
+    const newMessage = {
+      ...msg,
+      id: generateId(),
+      createdAt: /* @__PURE__ */ new Date()
+    };
+    setMessages((prev) => [...prev, newMessage]);
+    return newMessage;
+  }, []);
+  const clearMessages = React2.useCallback(() => {
+    setMessages([]);
+    setError(null);
+    setStreamingContent("");
+  }, []);
+  const stop = React2.useCallback(() => {
+    abortControllerRef.current?.abort();
+    setStatus("idle");
+  }, []);
+  const sendMessage = React2.useCallback(async (content) => {
+    if (!mc) {
+      const err = new Error("MindCache not initialized");
+      setError(err);
+      onError?.(err);
+      return;
+    }
+    if (!apiKey) {
+      const err = new Error("API key not configured. Please set your API key.");
+      setError(err);
+      onError?.(err);
+      return;
+    }
+    abortControllerRef.current?.abort();
+    abortControllerRef.current = new AbortController();
+    const userMessage = addMessage({ role: "user", content });
+    setStatus("loading");
+    setError(null);
+    setStreamingContent("");
+    try {
+      const model = context.getModel();
+      const finalSystemPrompt = systemPrompt || mc.get_system_prompt();
+      const tools = mc.create_vercel_ai_tools();
+      const apiMessages = messages.concat(userMessage).map((m) => ({
+        role: m.role,
+        content: m.content
+      }));
+      setStatus("streaming");
+      const parts = [];
+      let accumulatedText = "";
+      const result = await ai.streamText({
+        model,
+        system: finalSystemPrompt,
+        messages: apiMessages,
+        tools,
+        stopWhen: ai.stepCountIs(maxToolCalls),
+        abortSignal: abortControllerRef.current.signal,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        onStepFinish: async (step) => {
+          if (step.toolCalls && step.toolCalls.length > 0) {
+            for (const toolCall of step.toolCalls) {
+              const toolName = toolCall.toolName;
+              const args = toolCall.args || toolCall.input || {};
+              parts.push({
+                type: "tool-call",
+                toolCallId: toolCall.toolCallId,
+                toolName,
+                args
+              });
+              if (typeof toolName === "string" && (toolName.startsWith("write_") || toolName === "create_key")) {
+                const value = args.value;
+                const result2 = mc.executeToolCall(toolName, value);
+                parts.push({
+                  type: "tool-result",
+                  toolCallId: toolCall.toolCallId,
+                  toolName,
+                  result: result2
+                });
+                onMindCacheChange?.();
+              }
+            }
+          }
+          if (step.text) {
+            accumulatedText += step.text;
+          }
+        }
+      });
+      for await (const chunk of result.textStream) {
+        accumulatedText += chunk;
+        setStreamingContent(accumulatedText);
+      }
+      if (accumulatedText) {
+        parts.unshift({ type: "text", text: accumulatedText });
+      }
+      const assistantMessage = {
+        id: generateId(),
+        role: "assistant",
+        content: accumulatedText,
+        parts: parts.length > 0 ? parts : void 0,
+        createdAt: /* @__PURE__ */ new Date()
+      };
+      setMessages((prev) => [...prev, assistantMessage]);
+      setStreamingContent("");
+      setStatus("idle");
+      onFinish?.(assistantMessage);
+    } catch (err) {
+      if (err.name === "AbortError") {
+        if (streamingContent) {
+          const partialMessage = {
+            id: generateId(),
+            role: "assistant",
+            content: streamingContent + " [stopped]",
+            createdAt: /* @__PURE__ */ new Date()
+          };
+          setMessages((prev) => [...prev, partialMessage]);
+        }
+        setStreamingContent("");
+        setStatus("idle");
+        return;
+      }
+      const error2 = err instanceof Error ? err : new Error(String(err));
+      setError(error2);
+      setStatus("error");
+      setStreamingContent("");
+      onError?.(error2);
+    }
+  }, [
+    mc,
+    apiKey,
+    context,
+    messages,
+    systemPrompt,
+    maxToolCalls,
+    addMessage,
+    onMindCacheChange,
+    onFinish,
+    onError,
+    streamingContent
+  ]);
+  React2.useEffect(() => {
+    return () => {
+      abortControllerRef.current?.abort();
+    };
+  }, []);
+  return {
+    messages,
+    status,
+    error,
+    sendMessage,
+    clearMessages,
+    isLoading: status === "loading" || status === "streaming",
+    addMessage,
+    stop,
+    streamingContent
+  };
+}
+var defaultTheme = {
+  background: "#000",
+  userBubble: "#1a1a2e",
+  assistantBubble: "#0d0d0d",
+  textColor: "#22c55e",
+  secondaryTextColor: "#6b7280",
+  borderColor: "#333",
+  primaryColor: "#22c55e",
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'
+};
+function DefaultMessage({
+  message,
+  theme
+}) {
+  const isUser = message.role === "user";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      style: {
+        display: "flex",
+        justifyContent: isUser ? "flex-end" : "flex-start",
+        marginBottom: "12px"
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          style: {
+            maxWidth: "80%",
+            padding: "12px 16px",
+            borderRadius: "12px",
+            backgroundColor: isUser ? theme.userBubble : theme.assistantBubble,
+            border: `1px solid ${theme.borderColor}`
+          },
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                style: {
+                  fontSize: "10px",
+                  color: theme.secondaryTextColor,
+                  marginBottom: "4px",
+                  textTransform: "uppercase"
+                },
+                children: isUser ? "You" : "Assistant"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                style: {
+                  color: theme.textColor,
+                  whiteSpace: "pre-wrap",
+                  wordBreak: "break-word",
+                  lineHeight: 1.5
+                },
+                children: message.content
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+function ApiKeyInput({
+  theme,
+  onSubmit
+}) {
+  const [key, setKey] = React2.useState("");
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (key.trim()) {
+      onSubmit(key.trim());
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        height: "100%",
+        padding: "20px"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            style: {
+              fontSize: "14px",
+              color: theme.textColor,
+              marginBottom: "16px",
+              textAlign: "center"
+            },
+            children: "Enter your API key to start chatting"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, style: { width: "100%", maxWidth: "400px" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              type: "password",
+              value: key,
+              onChange: (e) => setKey(e.target.value),
+              placeholder: "sk-...",
+              style: {
+                width: "100%",
+                padding: "12px",
+                backgroundColor: theme.assistantBubble,
+                border: `1px solid ${theme.borderColor}`,
+                borderRadius: "8px",
+                color: theme.textColor,
+                fontFamily: theme.fontFamily,
+                fontSize: "14px",
+                marginBottom: "12px"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "submit",
+              disabled: !key.trim(),
+              style: {
+                width: "100%",
+                padding: "12px",
+                backgroundColor: theme.primaryColor,
+                border: "none",
+                borderRadius: "8px",
+                color: "#000",
+                fontFamily: theme.fontFamily,
+                fontSize: "14px",
+                fontWeight: "bold",
+                cursor: key.trim() ? "pointer" : "not-allowed",
+                opacity: key.trim() ? 1 : 0.5
+              },
+              children: "Save & Start"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            style: {
+              fontSize: "11px",
+              color: theme.secondaryTextColor,
+              marginTop: "16px",
+              textAlign: "center"
+            },
+            children: "Your key is stored locally and never sent to our servers."
+          }
+        )
+      ]
+    }
+  );
+}
+function MindCacheChat({
+  theme: customTheme,
+  placeholder = "Type a message...",
+  welcomeMessage = "Hello! I'm ready to help you.",
+  showApiKeyInput = true,
+  className,
+  style,
+  renderMessage,
+  header,
+  footer,
+  initialMessages,
+  ...chatOptions
+}) {
+  const context = useMindCacheContext();
+  const theme = { ...defaultTheme, ...customTheme };
+  const messagesEndRef = React2.useRef(null);
+  const inputRef = React2.useRef(null);
+  const [inputValue, setInputValue] = React2.useState("");
+  const defaultInitialMessages = welcomeMessage ? [
+    {
+      id: "welcome",
+      role: "assistant",
+      content: welcomeMessage,
+      createdAt: /* @__PURE__ */ new Date()
+    }
+  ] : [];
+  const {
+    messages,
+    sendMessage,
+    isLoading,
+    error,
+    streamingContent,
+    stop
+  } = useClientChat({
+    ...chatOptions,
+    initialMessages: initialMessages || defaultInitialMessages,
+    mindcache: context.mindcache || void 0
+  });
+  React2.useEffect(() => {
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [messages]);
+  const handleSubmit = async (e) => {
+    e?.preventDefault();
+    if (!inputValue.trim() || isLoading) {
+      return;
+    }
+    const message = inputValue.trim();
+    setInputValue("");
+    await sendMessage(message);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSubmit();
+    }
+  };
+  if (showApiKeyInput && !context.hasApiKey && context.aiConfig.keyStorage !== "memory") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className,
+        style: {
+          display: "flex",
+          flexDirection: "column",
+          height: "100%",
+          backgroundColor: theme.background,
+          fontFamily: theme.fontFamily,
+          ...style
+        },
+        children: [
+          header,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ApiKeyInput,
+            {
+              theme,
+              onSubmit: (key) => context.setApiKey(key)
+            }
+          ),
+          footer
+        ]
+      }
+    );
+  }
+  if (!context.isLoaded) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className,
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          height: "100%",
+          backgroundColor: theme.background,
+          color: theme.textColor,
+          fontFamily: theme.fontFamily,
+          ...style
+        },
+        children: "Loading..."
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className,
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        backgroundColor: theme.background,
+        fontFamily: theme.fontFamily,
+        ...style
+      },
+      children: [
+        header,
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            style: {
+              flex: 1,
+              overflowY: "auto",
+              padding: "16px"
+            },
+            children: [
+              messages.map((message) => renderMessage ? /* @__PURE__ */ jsxRuntime.jsx(React2__default.default.Fragment, { children: renderMessage(message) }, message.id) : /* @__PURE__ */ jsxRuntime.jsx(DefaultMessage, { message, theme }, message.id)),
+              streamingContent && /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    justifyContent: "flex-start",
+                    marginBottom: "12px"
+                  },
+                  children: /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      style: {
+                        maxWidth: "80%",
+                        padding: "12px 16px",
+                        borderRadius: "12px",
+                        backgroundColor: theme.assistantBubble,
+                        border: `1px solid ${theme.borderColor}`
+                      },
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "div",
+                          {
+                            style: {
+                              fontSize: "10px",
+                              color: theme.secondaryTextColor,
+                              marginBottom: "4px",
+                              textTransform: "uppercase"
+                            },
+                            children: "Assistant"
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsxs(
+                          "div",
+                          {
+                            style: {
+                              color: theme.textColor,
+                              whiteSpace: "pre-wrap",
+                              wordBreak: "break-word",
+                              lineHeight: 1.5
+                            },
+                            children: [
+                              streamingContent,
+                              /* @__PURE__ */ jsxRuntime.jsx("span", { style: { opacity: 0.5, animation: "blink 1s infinite" }, children: "\u258A" })
+                            ]
+                          }
+                        )
+                      ]
+                    }
+                  )
+                }
+              ),
+              isLoading && !streamingContent && /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    justifyContent: "flex-start",
+                    marginBottom: "12px"
+                  },
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    "div",
+                    {
+                      style: {
+                        padding: "12px 16px",
+                        borderRadius: "12px",
+                        backgroundColor: theme.assistantBubble,
+                        border: `1px solid ${theme.borderColor}`,
+                        color: theme.secondaryTextColor
+                      },
+                      children: "Thinking..."
+                    }
+                  )
+                }
+              ),
+              error && /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  style: {
+                    padding: "12px",
+                    marginBottom: "12px",
+                    borderRadius: "8px",
+                    backgroundColor: "rgba(239, 68, 68, 0.1)",
+                    border: "1px solid rgba(239, 68, 68, 0.3)",
+                    color: "#ef4444",
+                    fontSize: "13px"
+                  },
+                  children: [
+                    "Error: ",
+                    error.message
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { ref: messagesEndRef })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "form",
+          {
+            onSubmit: handleSubmit,
+            style: {
+              padding: "12px 16px",
+              borderTop: `1px solid ${theme.borderColor}`
+            },
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  gap: "8px",
+                  alignItems: "flex-end"
+                },
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "textarea",
+                    {
+                      ref: inputRef,
+                      value: inputValue,
+                      onChange: (e) => {
+                        setInputValue(e.target.value);
+                        e.target.style.height = "auto";
+                        e.target.style.height = Math.min(e.target.scrollHeight, 120) + "px";
+                      },
+                      onKeyDown: handleKeyDown,
+                      placeholder: isLoading ? "Waiting for response..." : placeholder,
+                      disabled: isLoading,
+                      rows: 1,
+                      style: {
+                        flex: 1,
+                        padding: "12px",
+                        backgroundColor: theme.assistantBubble,
+                        border: `1px solid ${theme.borderColor}`,
+                        borderRadius: "8px",
+                        color: theme.textColor,
+                        fontFamily: theme.fontFamily,
+                        fontSize: "16px",
+                        // Prevents iOS zoom on focus
+                        resize: "none",
+                        minHeight: "44px",
+                        // Apple touch target minimum
+                        maxHeight: "120px",
+                        outline: "none",
+                        WebkitAppearance: "none"
+                        // Remove iOS styling
+                      }
+                    }
+                  ),
+                  isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: stop,
+                      style: {
+                        padding: "12px 20px",
+                        minWidth: "44px",
+                        // Touch target
+                        minHeight: "44px",
+                        // Touch target
+                        backgroundColor: "#ef4444",
+                        border: "none",
+                        borderRadius: "8px",
+                        color: "#fff",
+                        fontFamily: theme.fontFamily,
+                        fontSize: "16px",
+                        fontWeight: "bold",
+                        cursor: "pointer",
+                        transition: "opacity 0.2s",
+                        WebkitTapHighlightColor: "transparent",
+                        touchAction: "manipulation"
+                        // Faster touch response
+                      },
+                      children: "Stop"
+                    }
+                  ) : /* @__PURE__ */ jsxRuntime.jsx(
+                    "button",
+                    {
+                      type: "submit",
+                      disabled: !inputValue.trim(),
+                      style: {
+                        padding: "12px 20px",
+                        minWidth: "44px",
+                        // Touch target
+                        minHeight: "44px",
+                        // Touch target
+                        backgroundColor: theme.primaryColor,
+                        border: "none",
+                        borderRadius: "8px",
+                        color: "#000",
+                        fontFamily: theme.fontFamily,
+                        fontSize: "16px",
+                        fontWeight: "bold",
+                        cursor: !inputValue.trim() ? "not-allowed" : "pointer",
+                        opacity: !inputValue.trim() ? 0.5 : 1,
+                        transition: "opacity 0.2s",
+                        WebkitTapHighlightColor: "transparent",
+                        touchAction: "manipulation"
+                        // Faster touch response
+                      },
+                      children: "Send"
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        ),
+        footer
+      ]
+    }
+  );
+}
+function useLocalFirstSync(options) {
+  const {
+    mindcache: mindcache2,
+    gitstore,
+    server,
+    autoSyncInterval = 0,
+    saveDebounceMs = 5e3,
+    loadOnMount = true,
+    mergeOnLoad = true
+  } = options;
+  const [status, setStatus] = React2.useState("idle");
+  const [error, setError] = React2.useState(null);
+  const [lastSyncAt, setLastSyncAt] = React2.useState(null);
+  const [hasLocalChanges, setHasLocalChanges] = React2.useState(false);
+  const saveTimeoutRef = React2.useRef(null);
+  const syncIntervalRef = React2.useRef(null);
+  const mountedRef = React2.useRef(true);
+  const getToken = React2.useCallback(async () => {
+    if (!gitstore) {
+      throw new Error("GitStore not configured");
+    }
+    return typeof gitstore.token === "function" ? await gitstore.token() : gitstore.token;
+  }, [gitstore]);
+  const load = React2.useCallback(async () => {
+    if (!mindcache2) {
+      return;
+    }
+    setStatus("loading");
+    setError(null);
+    try {
+      if (gitstore) {
+        let gitStoreModule;
+        try {
+          gitStoreModule = await Function('return import("@mindcache/gitstore")')();
+        } catch {
+          throw new Error("@mindcache/gitstore is not installed. Run: npm install @mindcache/gitstore");
+        }
+        const { GitStore, MindCacheSync } = gitStoreModule;
+        const token = await getToken();
+        const store = new GitStore({
+          owner: gitstore.owner,
+          repo: gitstore.repo,
+          branch: gitstore.branch,
+          tokenProvider: async () => token
+        });
+        const sync2 = new MindCacheSync(store, mindcache2, {
+          filePath: gitstore.path || "mindcache.md"
+        });
+        await sync2.load({ merge: mergeOnLoad });
+      } else if (server) {
+        const response = await fetch(server.url, {
+          headers: server.authToken ? { Authorization: `Bearer ${server.authToken}` } : {}
+        });
+        if (response.ok) {
+          const markdown = await response.text();
+          mindcache2.fromMarkdown(markdown, mergeOnLoad);
+        }
+      }
+      if (mountedRef.current) {
+        setLastSyncAt(/* @__PURE__ */ new Date());
+        setStatus("idle");
+      }
+    } catch (err) {
+      if (mountedRef.current) {
+        const error2 = err instanceof Error ? err : new Error(String(err));
+        setError(error2);
+        setStatus("error");
+      }
+      throw err;
+    }
+  }, [mindcache2, gitstore, server, getToken, mergeOnLoad]);
+  const save = React2.useCallback(async (message) => {
+    if (!mindcache2) {
+      return;
+    }
+    setStatus("saving");
+    setError(null);
+    try {
+      if (gitstore) {
+        let gitStoreModule;
+        try {
+          gitStoreModule = await Function('return import("@mindcache/gitstore")')();
+        } catch {
+          throw new Error("@mindcache/gitstore is not installed. Run: npm install @mindcache/gitstore");
+        }
+        const { GitStore, MindCacheSync } = gitStoreModule;
+        const token = await getToken();
+        const store = new GitStore({
+          owner: gitstore.owner,
+          repo: gitstore.repo,
+          branch: gitstore.branch,
+          tokenProvider: async () => token
+        });
+        const sync2 = new MindCacheSync(store, mindcache2, {
+          filePath: gitstore.path || "mindcache.md"
+        });
+        await sync2.save({ message: message || "MindCache sync" });
+      } else if (server) {
+        await fetch(server.url, {
+          method: "POST",
+          headers: {
+            "Content-Type": "text/plain",
+            ...server.authToken ? { Authorization: `Bearer ${server.authToken}` } : {}
+          },
+          body: mindcache2.toMarkdown()
+        });
+      }
+      if (mountedRef.current) {
+        setLastSyncAt(/* @__PURE__ */ new Date());
+        setHasLocalChanges(false);
+        setStatus("idle");
+      }
+    } catch (err) {
+      if (mountedRef.current) {
+        const error2 = err instanceof Error ? err : new Error(String(err));
+        setError(error2);
+        setStatus("error");
+      }
+      throw err;
+    }
+  }, [mindcache2, gitstore, server, getToken]);
+  const sync = React2.useCallback(async () => {
+    setStatus("syncing");
+    try {
+      await load();
+      if (hasLocalChanges) {
+        await save();
+      }
+    } catch (err) {
+    }
+  }, [load, save, hasLocalChanges]);
+  const markSaved = React2.useCallback(() => {
+    setHasLocalChanges(false);
+  }, []);
+  React2.useEffect(() => {
+    if (!mindcache2 || !gitstore || saveDebounceMs <= 0) {
+      return;
+    }
+    const unsubscribe = mindcache2.subscribeToAll(() => {
+      setHasLocalChanges(true);
+      if (saveTimeoutRef.current) {
+        clearTimeout(saveTimeoutRef.current);
+      }
+      saveTimeoutRef.current = setTimeout(() => {
+        save("Auto-save").catch(console.error);
+      }, saveDebounceMs);
+    });
+    return () => {
+      unsubscribe();
+      if (saveTimeoutRef.current) {
+        clearTimeout(saveTimeoutRef.current);
+      }
+    };
+  }, [mindcache2, gitstore, saveDebounceMs, save]);
+  React2.useEffect(() => {
+    if (!mindcache2 || autoSyncInterval <= 0) {
+      return;
+    }
+    syncIntervalRef.current = setInterval(() => {
+      sync().catch(console.error);
+    }, autoSyncInterval);
+    return () => {
+      if (syncIntervalRef.current) {
+        clearInterval(syncIntervalRef.current);
+      }
+    };
+  }, [mindcache2, autoSyncInterval, sync]);
+  React2.useEffect(() => {
+    if (loadOnMount && mindcache2 && (gitstore || server)) {
+      load().catch(console.error);
+    }
+  }, [mindcache2, gitstore, server, loadOnMount]);
+  React2.useEffect(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+  return {
+    status,
+    error,
+    lastSyncAt,
+    hasLocalChanges,
+    load,
+    save,
+    sync,
+    markSaved
+  };
+}
 
 // src/index.ts
 var mindcache = new MindCache();
 
 exports.DEFAULT_KEY_ATTRIBUTES = DEFAULT_KEY_ATTRIBUTES;
 exports.MindCache = MindCache;
+exports.MindCacheChat = MindCacheChat;
+exports.MindCacheProvider = MindCacheProvider;
 exports.OAuthClient = OAuthClient;
 exports.SchemaParser = SchemaParser;
 exports.SystemTagHelpers = SystemTagHelpers;
 exports.createOAuthClient = createOAuthClient;
 exports.mindcache = mindcache;
+exports.useClientChat = useClientChat;
+exports.useLocalFirstSync = useLocalFirstSync;
 exports.useMindCache = useMindCache;
+exports.useMindCacheContext = useMindCacheContext;
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map