opencami 1.7.0 → 1.8.3

package/dist/server/assets/settings-dialog-D3fOAswX.js

@@ -1,1173 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useState, useEffect, useRef } from "react";
-import { B as Button, c as cn } from "./button-CwY2OHFj.js";
-import { HugeiconsIcon } from "@hugeicons/react";
-import { Cancel01Icon, Link01Icon, PaintBoardIcon, MessageEdit01Icon, Settings02Icon, UserIcon, VoiceIcon, AiBrain01Icon, InformationCircleIcon, ComputerIcon, Sun01Icon, Moon01Icon, Leaf01Icon, DropletIcon, Loading02Icon, Tick01Icon, Cancel02Icon } from "@hugeicons/core-free-icons";
-import { D as DialogRoot, a as DialogContent, b as DialogTitle, c as DialogDescription, d as DialogClose } from "./use-file-explorer-state-s7CS50ho.js";
-import { S as Switch } from "./switch-BbkUeVDV.js";
-import { T as Tabs, a as TabsList, b as TabsTab } from "./tabs-DDFZob0m.js";
-import { u as useChatSettings } from "./index-Dl2BOKP7.js";
-import { u as useLlmSettings, g as getLlmProviderDefaults } from "./_sessionKey-BBG3ZUlo.js";
-import "@base-ui/react/merge-props";
-import "@base-ui/react/use-render";
-import "class-variance-authority";
-import "clsx";
-import "tailwind-merge";
-import "@base-ui/react/dialog";
-import "zustand";
-import "@base-ui/react/switch";
-import "@base-ui/react/tabs";
-import "zustand/middleware";
-import "@tanstack/react-router";
-import "@tanstack/react-query";
-import "./tooltip-DgsSPocE.js";
-import "@base-ui/react/tooltip";
-import "motion/react";
-import "@base-ui/react/alert-dialog";
-import "@base-ui/react/collapsible";
-import "@base-ui/react/scroll-area";
-import "./menu-D90CDTi2.js";
-import "@base-ui/react/menu";
-import "./opencami-logo-C-43FL3R.js";
-import "./markdown-BFE5y9YH.js";
-import "marked";
-import "react-markdown";
-import "remark-breaks";
-import "remark-gfm";
-import "react-dom";
-import "./router-Bl2uabfY.js";
-import "node:crypto";
-import "ws";
-import "node:fs";
-import "node:path";
-import "node:os";
-import "@tanstack/router-core/ssr/client";
-import "node:child_process";
-import "node:fs/promises";
-import "path";
-function SettingsSection({ title, tabId, activeTab, children }) {
-  const hiddenOnDesktop = tabId && activeTab && tabId !== activeTab;
-  return /* @__PURE__ */ jsxs("div", { className: cn(
-    "border-b border-primary-200 py-2 last:border-0",
-    hiddenOnDesktop && "md:hidden"
-  ), children: [
-    /* @__PURE__ */ jsx("h3", { className: "mb-1.5 text-sm font-semibold text-primary-700", children: title }),
-    /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children })
-  ] });
-}
-function SettingsRow({ label, description, inline, children }) {
-  if (inline) {
-    return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex-1 select-none", children: [
-        /* @__PURE__ */ jsx("div", { className: "text-[13px] font-medium text-primary-800", children: label }),
-        description && /* @__PURE__ */ jsx("div", { className: "text-xs text-primary-500", children: description })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-    /* @__PURE__ */ jsxs("div", { className: "select-none", children: [
-      /* @__PURE__ */ jsx("div", { className: "text-[13px] font-medium text-primary-800", children: label }),
-      description && /* @__PURE__ */ jsx("div", { className: "text-xs text-primary-500", children: description })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 flex-wrap", children })
-  ] });
-}
-const textSizeOptions = [
-  { value: "14px", label: "S" },
-  { value: "16px", label: "M" },
-  { value: "18px", label: "L" },
-  { value: "20px", label: "XL" }
-];
-const fontFamilyOptions = [
-  {
-    value: "system",
-    label: "System",
-    cssValue: '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
-    previewClass: "font-sans"
-  },
-  {
-    value: "inter",
-    label: "Inter",
-    cssValue: '"Inter", sans-serif',
-    previewClass: 'font-["Inter",sans-serif]'
-  },
-  {
-    value: "roboto",
-    label: "Roboto",
-    cssValue: '"Roboto", sans-serif',
-    previewClass: 'font-["Roboto",sans-serif]'
-  }
-];
-const densityOptions = [
-  { value: "compact", label: "Compact" },
-  { value: "comfortable", label: "Comfortable" },
-  { value: "spacious", label: "Spacious" }
-];
-const accentColorOptions = [
-  { value: "green", label: "Green", accent: "#22c55e", hover: "#16a34a", light: "rgba(34, 197, 94, 0.10)" },
-  { value: "blue", label: "Blue", accent: "#3b82f6", hover: "#2563eb", light: "rgba(59, 130, 246, 0.10)" },
-  { value: "purple", label: "Purple", accent: "#8b5cf6", hover: "#7c3aed", light: "rgba(139, 92, 246, 0.10)" },
-  { value: "orange", label: "Orange", accent: "#f97316", hover: "#ea580c", light: "rgba(249, 115, 22, 0.10)" },
-  { value: "pink", label: "Pink", accent: "#ec4899", hover: "#db2777", light: "rgba(236, 72, 153, 0.10)" },
-  { value: "red", label: "Red", accent: "#ef4444", hover: "#dc2626", light: "rgba(239, 68, 68, 0.10)" },
-  { value: "cyan", label: "Cyan", accent: "#06b6d4", hover: "#0891b2", light: "rgba(6, 182, 212, 0.10)" },
-  { value: "yellow", label: "Yellow", accent: "#eab308", hover: "#ca8a04", light: "rgba(234, 179, 8, 0.10)" }
-];
-const chatWidthOptions = [
-  { value: "narrow", label: "Narrow", cssValue: "640px" },
-  { value: "medium", label: "Medium", cssValue: "800px" },
-  { value: "wide", label: "Wide", cssValue: "1000px" },
-  { value: "full", label: "Full", cssValue: "100%" }
-];
-const sidebarWidthOptions = [
-  { value: "compact", label: "Compact", cssValue: "200px" },
-  { value: "normal", label: "Normal", cssValue: "260px" },
-  { value: "wide", label: "Wide", cssValue: "320px" },
-  { value: "xl", label: "XL", cssValue: "400px" }
-];
-const bubbleStyleOptions = [
-  { value: "default", label: "Default" },
-  { value: "bubbles", label: "Bubbles" },
-  { value: "minimal", label: "Minimal" }
-];
-function isTextSizeValue(value) {
-  return textSizeOptions.some((option) => option.value === value);
-}
-function isFontFamilyValue(value) {
-  return fontFamilyOptions.some((option) => option.value === value);
-}
-function isDensityValue(value) {
-  return densityOptions.some((option) => option.value === value);
-}
-function isAccentColorValue(value) {
-  return accentColorOptions.some((option) => option.value === value);
-}
-function isChatWidthValue(value) {
-  return chatWidthOptions.some((option) => option.value === value);
-}
-function isSidebarWidthValue(value) {
-  return sidebarWidthOptions.some((option) => option.value === value);
-}
-function isBubbleStyleValue(value) {
-  return bubbleStyleOptions.some((option) => option.value === value);
-}
-function SettingsDialog({
-  open,
-  onOpenChange,
-  onClose
-}) {
-  const { settings, updateSettings } = useChatSettings();
-  const {
-    settings: llmSettings,
-    updateSettings: updateLlmSettings,
-    status: llmStatus,
-    testApiKey
-  } = useLlmSettings();
-  const [activeTab, setActiveTab] = useState("appearance");
-  const [apiKeyInput, setApiKeyInput] = useState(llmSettings.llmApiKey);
-  const [testingKey, setTestingKey] = useState(false);
-  const [testResult, setTestResult] = useState(null);
-  const [textSize, setTextSize] = useState(() => {
-    if (typeof window === "undefined") return "16px";
-    try {
-      const stored = localStorage.getItem("opencami-text-size");
-      if (stored && isTextSizeValue(stored)) return stored;
-    } catch {
-    }
-    return "16px";
-  });
-  const [ttsEnabled, setTtsEnabled] = useState(() => {
-    if (typeof window === "undefined") return true;
-    try {
-      const stored = localStorage.getItem("opencami-tts-enabled");
-      return stored === null ? true : stored === "true";
-    } catch {
-      return true;
-    }
-  });
-  const [ttsProvider, setTtsProvider] = useState(() => {
-    if (typeof window === "undefined") return "auto";
-    try {
-      return localStorage.getItem("opencami-tts-provider") || "auto";
-    } catch {
-      return "auto";
-    }
-  });
-  const [ttsVoice, setTtsVoice] = useState(() => {
-    if (typeof window === "undefined") return "nova";
-    try {
-      return localStorage.getItem("opencami-tts-voice") || "nova";
-    } catch {
-      return "nova";
-    }
-  });
-  const [sttProvider, setSttProvider] = useState(() => {
-    if (typeof window === "undefined") return "auto";
-    try {
-      return localStorage.getItem("opencami-stt-provider") || "auto";
-    } catch {
-      return "auto";
-    }
-  });
-  useEffect(() => {
-    if (typeof window === "undefined") return;
-    try {
-      const storedFontFamily = localStorage.getItem("opencami-font-family");
-      if (storedFontFamily && isFontFamilyValue(storedFontFamily)) {
-        applyFontFamily(storedFontFamily);
-        if (settings.fontFamily !== storedFontFamily) {
-          updateSettings({ fontFamily: storedFontFamily });
-        }
-      } else {
-        applyFontFamily(settings.fontFamily);
-      }
-      const storedDensity = localStorage.getItem("opencami-density");
-      if (storedDensity && isDensityValue(storedDensity)) {
-        applyDensity(storedDensity);
-        if (settings.density !== storedDensity) {
-          updateSettings({ density: storedDensity });
-        }
-      } else {
-        applyDensity(settings.density);
-      }
-      const storedAccentColor = localStorage.getItem("opencami-accent-color");
-      if (storedAccentColor && isAccentColorValue(storedAccentColor)) {
-        applyAccentColor(storedAccentColor);
-        if (settings.accentColor !== storedAccentColor) {
-          updateSettings({ accentColor: storedAccentColor });
-        }
-      } else {
-        applyAccentColor(settings.accentColor);
-      }
-      const storedChatWidth = localStorage.getItem("opencami-chat-width");
-      if (storedChatWidth && isChatWidthValue(storedChatWidth)) {
-        applyChatWidth(storedChatWidth);
-        if (settings.chatWidth !== storedChatWidth) {
-          updateSettings({ chatWidth: storedChatWidth });
-        }
-      } else {
-        applyChatWidth(settings.chatWidth);
-      }
-      const storedSidebarWidth = localStorage.getItem("opencami-sidebar-width");
-      if (storedSidebarWidth && isSidebarWidthValue(storedSidebarWidth)) {
-        applySidebarWidth(storedSidebarWidth);
-        if (settings.sidebarWidth !== storedSidebarWidth) {
-          updateSettings({ sidebarWidth: storedSidebarWidth });
-        }
-      } else {
-        applySidebarWidth(settings.sidebarWidth);
-      }
-      const storedBubbleStyle = localStorage.getItem("opencami-bubble-style");
-      if (storedBubbleStyle && isBubbleStyleValue(storedBubbleStyle)) {
-        applyBubbleStyle(storedBubbleStyle);
-        if (settings.bubbleStyle !== storedBubbleStyle) {
-          updateSettings({ bubbleStyle: storedBubbleStyle });
-        }
-      } else {
-        applyBubbleStyle(settings.bubbleStyle);
-      }
-    } catch {
-      applyFontFamily(settings.fontFamily);
-      applyDensity(settings.density);
-      applyAccentColor(settings.accentColor);
-      applyChatWidth(settings.chatWidth);
-      applySidebarWidth(settings.sidebarWidth);
-      applyBubbleStyle(settings.bubbleStyle);
-    }
-  }, []);
-  useEffect(() => {
-    applyFontFamily(settings.fontFamily);
-  }, [settings.fontFamily]);
-  useEffect(() => {
-    applyDensity(settings.density);
-  }, [settings.density]);
-  useEffect(() => {
-    applyAccentColor(settings.accentColor);
-  }, [settings.accentColor]);
-  useEffect(() => {
-    applyChatWidth(settings.chatWidth);
-  }, [settings.chatWidth]);
-  useEffect(() => {
-    applySidebarWidth(settings.sidebarWidth);
-  }, [settings.sidebarWidth]);
-  useEffect(() => {
-    applyBubbleStyle(settings.bubbleStyle);
-  }, [settings.bubbleStyle]);
-  const handleTtsProviderChange = (value) => {
-    setTtsProvider(value);
-    try {
-      localStorage.setItem("opencami-tts-provider", value);
-    } catch {
-    }
-  };
-  const handleTtsVoiceChange = (value) => {
-    setTtsVoice(value);
-    try {
-      localStorage.setItem("opencami-tts-voice", value);
-    } catch {
-    }
-  };
-  const handleSttProviderChange = (value) => {
-    setSttProvider(value);
-    try {
-      localStorage.setItem("opencami-stt-provider", value);
-    } catch {
-    }
-  };
-  function applyTextSize(value) {
-    if (typeof document === "undefined") return;
-    document.documentElement.style.setProperty("--opencami-text-size", value);
-  }
-  function applyFontFamily(value) {
-    if (typeof document === "undefined") return;
-    const selected = fontFamilyOptions.find((option) => option.value === value);
-    const cssValue = selected?.cssValue ?? fontFamilyOptions[0].cssValue;
-    document.documentElement.style.setProperty("--opencami-font-family", cssValue);
-  }
-  function applyDensity(value) {
-    if (typeof document === "undefined") return;
-    const root = document.documentElement;
-    root.style.setProperty("--opencami-density", value);
-    if (value === "compact") {
-      root.style.setProperty("--opencami-msg-padding-y", "0.25rem");
-      root.style.setProperty("--opencami-msg-gap", "0.25rem");
-      root.style.setProperty("--opencami-user-bubble-py", "0.4rem");
-      return;
-    }
-    if (value === "spacious") {
-      root.style.setProperty("--opencami-msg-padding-y", "1.25rem");
-      root.style.setProperty("--opencami-msg-gap", "1rem");
-      root.style.setProperty("--opencami-user-bubble-py", "1rem");
-      return;
-    }
-    root.style.setProperty("--opencami-msg-padding-y", "0.75rem");
-    root.style.setProperty("--opencami-msg-gap", "0.5rem");
-    root.style.setProperty("--opencami-user-bubble-py", "0.625rem");
-  }
-  function applyAccentColor(value) {
-    if (typeof document === "undefined") return;
-    const selected = accentColorOptions.find((option) => option.value === value) ?? accentColorOptions[0];
-    const root = document.documentElement;
-    root.style.setProperty("--opencami-accent", selected.accent);
-    root.style.setProperty("--opencami-accent-hover", selected.hover);
-    root.style.setProperty("--opencami-accent-light", selected.light);
-  }
-  function applyChatWidth(value) {
-    if (typeof document === "undefined") return;
-    const selected = chatWidthOptions.find((option) => option.value === value) ?? chatWidthOptions[2];
-    document.documentElement.style.setProperty("--opencami-chat-width", selected.cssValue);
-  }
-  function applySidebarWidth(value) {
-    if (typeof document === "undefined") return;
-    const selected = sidebarWidthOptions.find((option) => option.value === value) ?? sidebarWidthOptions[1];
-    document.documentElement.style.setProperty("--opencami-sidebar-width", selected.cssValue);
-  }
-  function applyBubbleStyle(value) {
-    if (typeof document === "undefined") return;
-    document.documentElement.setAttribute("data-opencami-bubble-style", value);
-  }
-  const handleTextSizeChange = (value) => {
-    if (!isTextSizeValue(value)) return;
-    setTextSize(value);
-    applyTextSize(value);
-    try {
-      localStorage.setItem("opencami-text-size", value);
-    } catch {
-    }
-  };
-  const handleFontFamilyChange = (value) => {
-    if (!isFontFamilyValue(value)) return;
-    applyFontFamily(value);
-    updateSettings({ fontFamily: value });
-    try {
-      localStorage.setItem("opencami-font-family", value);
-    } catch {
-    }
-  };
-  const handleDensityChange = (value) => {
-    if (!isDensityValue(value)) return;
-    applyDensity(value);
-    updateSettings({ density: value });
-    try {
-      localStorage.setItem("opencami-density", value);
-    } catch {
-    }
-  };
-  const handleAccentColorChange = (value) => {
-    if (!isAccentColorValue(value)) return;
-    applyAccentColor(value);
-    updateSettings({ accentColor: value });
-    try {
-      localStorage.setItem("opencami-accent-color", value);
-    } catch {
-    }
-  };
-  const handleChatWidthChange = (value) => {
-    if (!isChatWidthValue(value)) return;
-    applyChatWidth(value);
-    updateSettings({ chatWidth: value });
-    try {
-      localStorage.setItem("opencami-chat-width", value);
-    } catch {
-    }
-  };
-  const handleSidebarWidthChange = (value) => {
-    if (!isSidebarWidthValue(value)) return;
-    applySidebarWidth(value);
-    updateSettings({ sidebarWidth: value });
-    try {
-      localStorage.setItem("opencami-sidebar-width", value);
-    } catch {
-    }
-  };
-  const handleBubbleStyleChange = (value) => {
-    if (!isBubbleStyleValue(value)) return;
-    applyBubbleStyle(value);
-    updateSettings({ bubbleStyle: value });
-    try {
-      localStorage.setItem("opencami-bubble-style", value);
-    } catch {
-    }
-  };
-  const handleTtsToggle = (checked) => {
-    setTtsEnabled(checked);
-    try {
-      localStorage.setItem("opencami-tts-enabled", String(checked));
-    } catch {
-    }
-    window.dispatchEvent(new StorageEvent("storage", {
-      key: "opencami-tts-enabled",
-      newValue: String(checked)
-    }));
-  };
-  const [personasAvailable, setPersonasAvailable] = useState(false);
-  const personasAbortControllerRef = useRef(null);
-  const [personasEnabled, setPersonasEnabled] = useState(() => {
-    if (typeof window === "undefined") return true;
-    try {
-      const stored = localStorage.getItem("opencami-personas-enabled");
-      return stored === null ? true : stored === "true";
-    } catch {
-      return true;
-    }
-  });
-  useEffect(() => {
-    let mounted = true;
-    async function checkPersonas() {
-      personasAbortControllerRef.current?.abort();
-      const controller = new AbortController();
-      personasAbortControllerRef.current = controller;
-      try {
-        const res = await fetch("/api/personas", { signal: controller.signal });
-        if (!res.ok) return;
-        const data = await res.json();
-        if (mounted && data.ok) {
-          setPersonasAvailable(data.available);
-        }
-      } catch (error) {
-        if (error instanceof Error && error.name === "AbortError") return;
-      }
-    }
-    checkPersonas();
-    return () => {
-      mounted = false;
-      personasAbortControllerRef.current?.abort();
-    };
-  }, []);
-  const handlePersonasToggle = (checked) => {
-    setPersonasEnabled(checked);
-    try {
-      localStorage.setItem("opencami-personas-enabled", String(checked));
-    } catch {
-    }
-    window.dispatchEvent(new StorageEvent("storage", {
-      key: "opencami-personas-enabled",
-      newValue: String(checked)
-    }));
-  };
-  const handleTestApiKey = async () => {
-    if (!apiKeyInput.trim()) return;
-    setTestingKey(true);
-    setTestResult(null);
-    try {
-      const result = await testApiKey(apiKeyInput.trim());
-      setTestResult(result);
-      if (result.valid) {
-        updateLlmSettings({ llmApiKey: apiKeyInput.trim() });
-      }
-    } finally {
-      setTestingKey(false);
-    }
-  };
-  const handleSaveApiKey = () => {
-    updateLlmSettings({ llmApiKey: apiKeyInput.trim() });
-    setTestResult(null);
-  };
-  const handleClearApiKey = () => {
-    setApiKeyInput("");
-    updateLlmSettings({ llmApiKey: "" });
-    setTestResult(null);
-  };
-  const themeOptions = [
-    { value: "system", label: "Auto", icon: ComputerIcon },
-    { value: "light", label: "Light", icon: Sun01Icon },
-    { value: "dark", label: "Dark", icon: Moon01Icon },
-    { value: "chameleon", label: "Cham", icon: Leaf01Icon },
-    { value: "frost-light", label: "Ice", icon: DropletIcon }
-  ];
-  function applyTheme(theme) {
-    if (typeof document === "undefined") return;
-    const root = document.documentElement;
-    const media = window.matchMedia("(prefers-color-scheme: dark)");
-    root.classList.remove("light", "dark", "system", "chameleon", "frost", "frost-light", "frost-dark");
-    root.style.colorScheme = "";
-    root.classList.add(theme);
-    const isFrostLight = theme === "frost-light";
-    const isFrostDark = theme === "frost-dark";
-    if (isFrostLight || isFrostDark) {
-      root.classList.add("frost");
-    }
-    if (isFrostDark) {
-      root.classList.add("dark");
-    }
-    if (theme === "system" && media.matches) {
-      root.classList.add("dark");
-    }
-    if (isFrostLight) {
-      root.classList.remove("dark");
-      root.style.colorScheme = "light";
-    }
-  }
-  return /* @__PURE__ */ jsx(DialogRoot, { open, onOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { className: "w-[min(680px,92vw)] max-h-[85vh] overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "p-3", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(DialogTitle, { className: "mb-1", children: "Settings" }),
-        /* @__PURE__ */ jsx(DialogDescription, { className: "hidden", children: "Configure OpenCami" })
-      ] }),
-      /* @__PURE__ */ jsx(
-        DialogClose,
-        {
-          render: /* @__PURE__ */ jsx(
-            Button,
-            {
-              size: "icon-sm",
-              variant: "ghost",
-              className: "text-primary-500 hover:bg-primary-100 hover:text-primary-700",
-              "aria-label": "Close",
-              children: /* @__PURE__ */ jsx(
-                HugeiconsIcon,
-                {
-                  icon: Cancel01Icon,
-                  size: 20,
-                  strokeWidth: 1.5
-                }
-              )
-            }
-          )
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "mt-2 flex md:flex-row flex-col md:gap-3 gap-0 md:min-h-[400px]", children: [
-      /* @__PURE__ */ jsx("nav", { className: "hidden md:flex flex-col gap-0.5 min-w-[160px] border-r border-primary-200 pr-3", children: [
-        { id: "connection", label: "Connection", icon: Link01Icon },
-        { id: "appearance", label: "Appearance", icon: PaintBoardIcon },
-        { id: "chat", label: "Chat", icon: MessageEdit01Icon },
-        { id: "workspace", label: "Workspace", icon: Settings02Icon },
-        { id: "personas", label: "Personas", icon: UserIcon },
-        { id: "voice", label: "Voice", icon: VoiceIcon },
-        { id: "llm", label: "LLM Features", icon: AiBrain01Icon },
-        { id: "about", label: "About", icon: InformationCircleIcon }
-      ].map((tab) => /* @__PURE__ */ jsxs(
-        "button",
-        {
-          onClick: () => setActiveTab(tab.id),
-          className: cn(
-            "flex items-center gap-2 px-2.5 py-1.5 rounded-md text-sm text-left transition-colors",
-            activeTab === tab.id ? "text-primary-900 font-medium" : "text-primary-600 hover:text-primary-900 hover:bg-primary-50"
-          ),
-          style: activeTab === tab.id ? { backgroundColor: "var(--opencami-accent-light)" } : void 0,
-          children: [
-            /* @__PURE__ */ jsx(HugeiconsIcon, { icon: tab.icon, size: 16, strokeWidth: 1.5 }),
-            tab.label
-          ]
-        },
-        tab.id
-      )) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto md:max-h-[calc(85vh-90px)] max-h-none", children: [
-        /* @__PURE__ */ jsx(SettingsSection, { title: "Connection", tabId: "connection", activeTab, children: /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Status", children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-sm text-green-600", children: [
-          /* @__PURE__ */ jsx("span", { className: "size-2 rounded-full bg-green-500" }),
-          "Connected"
-        ] }) }) }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "Appearance", tabId: "appearance", activeTab, children: [
-          /* @__PURE__ */ jsx(SettingsRow, { label: "Theme", children: /* @__PURE__ */ jsx(
-            Tabs,
-            {
-              value: settings.theme,
-              onValueChange: (value) => {
-                const theme = value;
-                applyTheme(theme);
-                updateSettings({ theme });
-              },
-              children: /* @__PURE__ */ jsx(
-                TabsList,
-                {
-                  variant: "default",
-                  className: "gap-1.5 flex-wrap *:data-[slot=tab-indicator]:duration-0",
-                  children: themeOptions.map((option) => /* @__PURE__ */ jsxs(TabsTab, { value: option.value, className: "text-[11px] px-1 py-0.5 gap-0.5", children: [
-                    option.icon && /* @__PURE__ */ jsx(
-                      HugeiconsIcon,
-                      {
-                        icon: option.icon,
-                        size: 13,
-                        strokeWidth: 1.5
-                      }
-                    ),
-                    /* @__PURE__ */ jsx("span", { children: option.label })
-                  ] }, option.value))
-                }
-              )
-            }
-          ) }),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              label: "Accent Color",
-              children: /* @__PURE__ */ jsx("div", { className: "flex gap-0.5 flex-wrap", children: accentColorOptions.map((option) => {
-                const selected = settings.accentColor === option.value;
-                return /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => handleAccentColorChange(option.value),
-                    className: cn(
-                      "flex items-center justify-center rounded-md p-1 transition-all duration-150",
-                      selected ? "scale-110" : "hover:bg-primary-50 hover:scale-105"
-                    ),
-                    children: /* @__PURE__ */ jsx(
-                      "span",
-                      {
-                        className: cn(
-                          "size-6 rounded-full transition-shadow duration-150",
-                          selected ? "ring-2 ring-offset-2" : "border-2 border-primary-200"
-                        ),
-                        style: {
-                          backgroundColor: option.accent,
-                          ...selected ? { "--tw-ring-color": option.accent } : {}
-                        }
-                      }
-                    )
-                  },
-                  option.value
-                );
-              }) })
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              label: "Text Size",
-              children: /* @__PURE__ */ jsx(Tabs, { value: textSize, onValueChange: handleTextSizeChange, children: /* @__PURE__ */ jsx(
-                TabsList,
-                {
-                  variant: "default",
-                  className: "gap-2 *:data-[slot=tab-indicator]:duration-0",
-                  children: textSizeOptions.map((option) => /* @__PURE__ */ jsx(TabsTab, { value: option.value, children: /* @__PURE__ */ jsx("span", { className: "tabular-nums text-xs", children: option.label }) }, option.value))
-                }
-              ) })
-            }
-          ),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Font", children: /* @__PURE__ */ jsx(Tabs, { value: settings.fontFamily, onValueChange: handleFontFamilyChange, children: /* @__PURE__ */ jsx(TabsList, { variant: "default", className: "gap-1 *:data-[slot=tab-indicator]:duration-0", children: fontFamilyOptions.map((option) => /* @__PURE__ */ jsx(TabsTab, { value: option.value, children: /* @__PURE__ */ jsx("span", { className: "text-xs", style: { fontFamily: option.cssValue }, children: option.label }) }, option.value)) }) }) }),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Density", children: /* @__PURE__ */ jsx(Tabs, { value: settings.density, onValueChange: handleDensityChange, children: /* @__PURE__ */ jsx(TabsList, { variant: "default", className: "gap-1 *:data-[slot=tab-indicator]:duration-0", children: densityOptions.map((option) => /* @__PURE__ */ jsx(TabsTab, { value: option.value, children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: option.label }) }, option.value)) }) }) }),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Bubbles", children: /* @__PURE__ */ jsx(Tabs, { value: settings.bubbleStyle, onValueChange: handleBubbleStyleChange, children: /* @__PURE__ */ jsx(TabsList, { variant: "default", className: "gap-1 *:data-[slot=tab-indicator]:duration-0", children: bubbleStyleOptions.map((option) => /* @__PURE__ */ jsx(TabsTab, { value: option.value, children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: option.label }) }, option.value)) }) }) }),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Chat Width", children: /* @__PURE__ */ jsx(Tabs, { value: settings.chatWidth, onValueChange: handleChatWidthChange, children: /* @__PURE__ */ jsx(TabsList, { variant: "default", className: "gap-1 *:data-[slot=tab-indicator]:duration-0", children: chatWidthOptions.map((option) => /* @__PURE__ */ jsx(TabsTab, { value: option.value, children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: option.label }) }, option.value)) }) }) }),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Sidebar", children: /* @__PURE__ */ jsx(Tabs, { value: settings.sidebarWidth, onValueChange: handleSidebarWidthChange, children: /* @__PURE__ */ jsx(TabsList, { variant: "default", className: "gap-1 *:data-[slot=tab-indicator]:duration-0", children: sidebarWidthOptions.map((option) => /* @__PURE__ */ jsx(TabsTab, { value: option.value, children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: option.label }) }, option.value)) }) }) })
-        ] }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "Chat", tabId: "chat", activeTab, children: [
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Show tool messages", children: /* @__PURE__ */ jsx(
-            Switch,
-            {
-              checked: settings.showToolMessages,
-              onCheckedChange: (checked) => updateSettings({ showToolMessages: checked })
-            }
-          ) }),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Show reasoning blocks", children: /* @__PURE__ */ jsx(
-            Switch,
-            {
-              checked: settings.showReasoningBlocks,
-              onCheckedChange: (checked) => updateSettings({ showReasoningBlocks: checked })
-            }
-          ) }),
-          /* @__PURE__ */ jsx(SettingsRow, { inline: true, label: "Show search sources", children: /* @__PURE__ */ jsx(
-            Switch,
-            {
-              checked: settings.showSearchSources,
-              onCheckedChange: (checked) => updateSettings({ showSearchSources: checked })
-            }
-          ) }),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Inline File Preview",
-              description: "Make file paths in messages clickable to preview file contents",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: settings.inlineFilePreview,
-                  onCheckedChange: (checked) => updateSettings({ inlineFilePreview: checked })
-                }
-              )
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "Workspace", tabId: "workspace", activeTab, children: [
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "File Explorer",
-              description: "Browse and edit workspace files from the sidebar",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: (() => {
-                    try {
-                      const v = localStorage.getItem("opencami-file-explorer");
-                      return v === null ? true : v === "true";
-                    } catch {
-                      return true;
-                    }
-                  })(),
-                  onCheckedChange: (checked) => {
-                    localStorage.setItem("opencami-file-explorer", String(checked));
-                    window.location.reload();
-                  }
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Memory Viewer",
-              description: "Browse and edit MEMORY.md and daily memory files",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: (() => {
-                    try {
-                      const v = localStorage.getItem("opencami-memory-viewer");
-                      return v === null ? true : v === "true";
-                    } catch {
-                      return true;
-                    }
-                  })(),
-                  onCheckedChange: (checked) => {
-                    localStorage.setItem("opencami-memory-viewer", String(checked));
-                    window.location.reload();
-                  }
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Agent Manager (Beta)",
-              description: "Show Agent Manager in sidebar for creating and managing agents",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: (() => {
-                    try {
-                      return localStorage.getItem("opencami-agent-manager") === "true";
-                    } catch {
-                      return false;
-                    }
-                  })(),
-                  onCheckedChange: (checked) => {
-                    localStorage.setItem("opencami-agent-manager", String(checked));
-                    window.location.reload();
-                  }
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Skills Browser (Beta)",
-              description: "Browse and install skills from ClawHub",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: (() => {
-                    try {
-                      return localStorage.getItem("opencami-skills-browser") === "true";
-                    } catch {
-                      return false;
-                    }
-                  })(),
-                  onCheckedChange: (checked) => {
-                    localStorage.setItem("opencami-skills-browser", String(checked));
-                    window.location.reload();
-                  }
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Cron Jobs Panel (Beta)",
-              description: "Show Cron Jobs in sidebar for managing OpenClaw cron schedules",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: (() => {
-                    try {
-                      return localStorage.getItem("opencami-cron-manager") === "true";
-                    } catch {
-                      return false;
-                    }
-                  })(),
-                  onCheckedChange: (checked) => {
-                    localStorage.setItem("opencami-cron-manager", String(checked));
-                    window.location.reload();
-                  }
-                }
-              )
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "Personas", tabId: "personas", activeTab, children: [
-          personasAvailable ? /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Persona Picker",
-              description: "Show persona picker in chat (20 personalities)",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: personasEnabled,
-                  onCheckedChange: handlePersonasToggle
-                }
-              )
-            }
-          ) : /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Persona Picker",
-              description: "Install the Personas skill to unlock 20 AI personalities",
-              children: /* @__PURE__ */ jsx(Switch, { checked: false, disabled: true })
-            }
-          ),
-          !personasAvailable && /* @__PURE__ */ jsx("div", { className: "pt-1", children: /* @__PURE__ */ jsx(
-            "a",
-            {
-              href: "https://www.clawhub.ai/robbyczgw-cla/personas",
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className: "text-xs text-primary-600 hover:text-primary-900 hover:underline",
-              children: "Get it on ClawHub →"
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "Text-to-Speech", tabId: "voice", activeTab, children: [
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Voice Playback",
-              description: "Add a 🔊 button to AI messages for text-to-speech",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: ttsEnabled,
-                  onCheckedChange: handleTtsToggle
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "TTS Provider",
-              description: "Choose which service generates speech",
-              children: /* @__PURE__ */ jsxs(
-                "select",
-                {
-                  value: ttsProvider,
-                  onChange: (e) => handleTtsProviderChange(e.target.value),
-                  className: "rounded-md border border-primary-200 bg-surface px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-primary-500",
-                  children: [
-                    /* @__PURE__ */ jsx("option", { value: "auto", children: "Auto" }),
-                    /* @__PURE__ */ jsx("option", { value: "elevenlabs", children: "ElevenLabs" }),
-                    /* @__PURE__ */ jsx("option", { value: "openai", children: "OpenAI" }),
-                    /* @__PURE__ */ jsx("option", { value: "edge", children: "Edge TTS (free)" })
-                  ]
-                }
-              )
-            }
-          ),
-          ttsProvider === "openai" && /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Voice",
-              description: "OpenAI voice selection",
-              children: /* @__PURE__ */ jsx(
-                "select",
-                {
-                  value: ttsVoice,
-                  onChange: (e) => handleTtsVoiceChange(e.target.value),
-                  className: "rounded-md border border-primary-200 bg-surface px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-primary-500",
-                  children: ["alloy", "echo", "fable", "onyx", "nova", "shimmer"].map((v) => /* @__PURE__ */ jsx("option", { value: v, children: v.charAt(0).toUpperCase() + v.slice(1) }, v))
-                }
-              )
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx(SettingsSection, { title: "Speech-to-Text", tabId: "voice", activeTab, children: /* @__PURE__ */ jsx(
-          SettingsRow,
-          {
-            inline: true,
-            label: "STT Provider",
-            description: "Choose which service transcribes your voice",
-            children: /* @__PURE__ */ jsxs(
-              "select",
-              {
-                value: sttProvider,
-                onChange: (e) => handleSttProviderChange(e.target.value),
-                className: "rounded-md border border-primary-200 bg-surface px-2 py-1 text-sm focus:outline-none focus:ring-2 focus:ring-primary-500",
-                children: [
-                  /* @__PURE__ */ jsx("option", { value: "auto", children: "Auto" }),
-                  /* @__PURE__ */ jsx("option", { value: "elevenlabs", children: "ElevenLabs" }),
-                  /* @__PURE__ */ jsx("option", { value: "openai", children: "OpenAI" }),
-                  /* @__PURE__ */ jsx("option", { value: "browser", children: "Browser (free)" })
-                ]
-              }
-            )
-          }
-        ) }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "LLM Features", tabId: "llm", activeTab, children: [
-          /* @__PURE__ */ jsxs("div", { className: "text-xs text-primary-500 mb-3", children: [
-            "Enhance session titles and follow-up suggestions using an LLM provider.",
-            llmStatus.hasEnvKey && llmSettings.llmProvider === "openai" && /* @__PURE__ */ jsx("span", { className: "block mt-1 text-green-600", children: "✓ Server has OPENAI_API_KEY configured" }),
-            llmStatus.hasOpenRouterKey && llmSettings.llmProvider === "openrouter" && /* @__PURE__ */ jsx("span", { className: "block mt-1 text-green-600", children: "✓ Server has OPENROUTER_API_KEY configured" })
-          ] }),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Provider",
-              description: "Choose LLM provider for titles & follow-ups",
-              children: /* @__PURE__ */ jsxs(
-                "select",
-                {
-                  value: llmSettings.llmProvider,
-                  onChange: (e) => {
-                    const provider = e.target.value;
-                    updateLlmSettings({
-                      llmProvider: provider,
-                      llmBaseUrl: "",
-                      llmModel: ""
-                    });
-                  },
-                  className: "px-2 py-1 text-sm rounded-md border border-primary-200 bg-surface focus:outline-none focus:ring-2 focus:ring-primary-500",
-                  children: [
-                    /* @__PURE__ */ jsx("option", { value: "openai", children: "OpenAI" }),
-                    /* @__PURE__ */ jsx("option", { value: "openrouter", children: "OpenRouter" }),
-                    /* @__PURE__ */ jsx("option", { value: "ollama", children: "Ollama (local)" }),
-                    /* @__PURE__ */ jsx("option", { value: "custom", children: "Custom" })
-                  ]
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Smart session titles",
-              description: "Generate concise titles using AI",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: llmSettings.useLlmTitles,
-                  onCheckedChange: (checked) => updateLlmSettings({ useLlmTitles: checked }),
-                  disabled: !llmStatus.isAvailable
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            SettingsRow,
-            {
-              inline: true,
-              label: "Smart follow-up suggestions",
-              description: "AI-generated contextual follow-ups",
-              children: /* @__PURE__ */ jsx(
-                Switch,
-                {
-                  checked: llmSettings.useLlmFollowUps,
-                  onCheckedChange: (checked) => updateLlmSettings({ useLlmFollowUps: checked }),
-                  disabled: !llmStatus.isAvailable
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxs("div", { className: "mt-2 space-y-2", children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("div", { className: "text-xs text-primary-500 mb-1", children: "Model" }),
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "text",
-                  value: llmSettings.llmModel,
-                  onChange: (e) => updateLlmSettings({ llmModel: e.target.value }),
-                  placeholder: getLlmProviderDefaults(llmSettings.llmProvider).model || "model-name",
-                  className: "w-full px-3 py-1.5 text-sm rounded-md border border-primary-200 bg-surface focus:outline-none focus:ring-2 focus:ring-primary-500"
-                }
-              )
-            ] }),
-            (llmSettings.llmProvider === "custom" || llmSettings.llmProvider === "ollama") && /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("div", { className: "text-xs text-primary-500 mb-1", children: "Base URL" }),
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "text",
-                  value: llmSettings.llmBaseUrl,
-                  onChange: (e) => updateLlmSettings({ llmBaseUrl: e.target.value }),
-                  placeholder: getLlmProviderDefaults(llmSettings.llmProvider).baseUrl || "https://...",
-                  className: "w-full px-3 py-1.5 text-sm rounded-md border border-primary-200 bg-surface focus:outline-none focus:ring-2 focus:ring-primary-500"
-                }
-              )
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "mt-4 pt-3 border-t border-primary-100", children: [
-            /* @__PURE__ */ jsx("div", { className: "text-sm text-primary-800 mb-2", children: llmSettings.llmProvider === "ollama" ? "API Key (optional)" : "API Key" }),
-            /* @__PURE__ */ jsx("div", { className: "text-xs text-primary-500 mb-2", children: llmSettings.llmProvider === "ollama" ? "Not required for local Ollama" : llmStatus.hasEnvKey && llmSettings.llmProvider === "openai" ? "Optional: Override server key with your own" : `Required for ${llmSettings.llmProvider === "openrouter" ? "OpenRouter" : "LLM features"} (stored locally)` }),
-            /* @__PURE__ */ jsxs("div", { className: "text-xs text-amber-600 bg-amber-50 border border-amber-200 rounded-md px-2 py-1.5 mb-2", children: [
-              "⚠️ ",
-              /* @__PURE__ */ jsx("strong", { children: "Security Note:" }),
-              " API keys are stored in your browser's localStorage. This is convenient but not secure for shared computers. For production use, configure keys server-side via environment variables (OPENAI_API_KEY, OPENROUTER_API_KEY)."
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "password",
-                  value: apiKeyInput,
-                  onChange: (e) => {
-                    setApiKeyInput(e.target.value);
-                    setTestResult(null);
-                  },
-                  placeholder: "sk-...",
-                  className: "flex-1 px-3 py-1.5 text-sm rounded-md border border-primary-200 bg-surface focus:outline-none focus:ring-2 focus:ring-primary-500"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  size: "sm",
-                  variant: "outline",
-                  onClick: handleTestApiKey,
-                  disabled: !apiKeyInput.trim() || testingKey,
-                  className: "min-w-[60px]",
-                  children: testingKey ? /* @__PURE__ */ jsx(
-                    HugeiconsIcon,
-                    {
-                      icon: Loading02Icon,
-                      size: 16,
-                      className: "animate-spin"
-                    }
-                  ) : "Test"
-                }
-              )
-            ] }),
-            testResult && /* @__PURE__ */ jsxs(
-              "div",
-              {
-                className: `mt-2 flex items-center gap-1.5 text-xs ${testResult.valid ? "text-green-600" : "text-red-600"}`,
-                children: [
-                  /* @__PURE__ */ jsx(
-                    HugeiconsIcon,
-                    {
-                      icon: testResult.valid ? Tick01Icon : Cancel02Icon,
-                      size: 14
-                    }
-                  ),
-                  testResult.valid ? "API key is valid" : testResult.error || "Invalid API key"
-                ]
-              }
-            ),
-            llmSettings.llmApiKey && /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center justify-between", children: [
-              /* @__PURE__ */ jsxs("span", { className: "text-xs text-green-600 flex items-center gap-1", children: [
-                /* @__PURE__ */ jsx(HugeiconsIcon, { icon: Tick01Icon, size: 14 }),
-                "Key saved"
-              ] }),
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  size: "sm",
-                  variant: "ghost",
-                  onClick: handleClearApiKey,
-                  className: "text-xs text-red-600 hover:text-red-700 hover:bg-red-50",
-                  children: "Clear"
-                }
-              )
-            ] }),
-            apiKeyInput && apiKeyInput !== llmSettings.llmApiKey && !testResult?.valid && /* @__PURE__ */ jsx(
-              Button,
-              {
-                size: "sm",
-                variant: "outline",
-                onClick: handleSaveApiKey,
-                className: "mt-2 w-full",
-                children: "Save without testing"
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs(SettingsSection, { title: "About", tabId: "about", activeTab, children: [
-          /* @__PURE__ */ jsx("div", { className: "text-sm text-primary-800", children: "OpenCami" }),
-          /* @__PURE__ */ jsxs("div", { className: "flex gap-4 pt-2", children: [
-            /* @__PURE__ */ jsx(
-              "a",
-              {
-                href: "https://github.com/robbyczgw-cla/opencami",
-                target: "_blank",
-                rel: "noopener noreferrer",
-                className: "text-sm text-primary-600 hover:text-primary-900 hover:underline",
-                children: "GitHub"
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "a",
-              {
-                href: "https://docs.openclaw.ai",
-                target: "_blank",
-                rel: "noopener noreferrer",
-                className: "text-sm text-primary-600 hover:text-primary-900 hover:underline",
-                children: "OpenClaw docs"
-              }
-            )
-          ] })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "mt-2 flex justify-end", children: /* @__PURE__ */ jsx(DialogClose, { onClick: onClose, children: "Close" }) })
-  ] }) }) });
-}
-export {
-  SettingsDialog
-};