@agent-native/core 0.90.11 → 0.91.0

package/dist/client/settings/SettingsPanel.js

@@ -441,7 +441,7 @@ function LLMSectionInner({ builderFlow, builderLoading, connectUrl, connected, o
         }
         catch { }
     };
-    return (_jsx(SettingsSection, { icon: _jsx(IconBrain, { size: 14 }), title: "LLM", subtitle: "Connect any major LLM \u2014 Claude, GPT, Gemini, and more.", required: true, connected: initialLoading ? undefined : anyKeyConfigured, open: open, onToggle: onToggle, children: initialLoading ? (_jsx(SettingsSkeleton, { lines: 3 })) : (_jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "llm_settings", trackingFlow: "connect_llm", label: "Connect Builder.io" }), !builderConnected && (_jsx(ManualSetupCard, { hint: manualSetupHint, docsUrl: PROVIDER_DOCS[selectedEngine], sourceBadge: sourceBadge, docsLabel: "Get an API key", children: _jsxs("div", { className: "space-y-2 mb-1", children: [_jsx(SettingsSelect, { label: "Provider", value: selectedEngine, options: providerOptions, onValueChange: (val) => {
+    return (_jsx(SettingsSection, { id: settingsSectionDomId("llm"), icon: _jsx(IconBrain, { size: 14 }), title: "LLM", subtitle: "Connect any major LLM \u2014 Claude, GPT, Gemini, and more.", required: true, connected: initialLoading ? undefined : anyKeyConfigured, open: open, onToggle: onToggle, children: initialLoading ? (_jsx(SettingsSkeleton, { lines: 3 })) : (_jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "llm_settings", trackingFlow: "connect_llm", label: "Connect Builder.io" }), !builderConnected && (_jsx(ManualSetupCard, { hint: manualSetupHint, docsUrl: PROVIDER_DOCS[selectedEngine], sourceBadge: sourceBadge, docsLabel: "Get an API key", children: _jsxs("div", { className: "space-y-2 mb-1", children: [_jsx(SettingsSelect, { label: "Provider", value: selectedEngine, options: providerOptions, onValueChange: (val) => {
                                     setSelectedEngine(val);
                                     const info = engines.find((e) => e.name === val);
                                     setSelectedModel(info?.defaultModel ?? "");
@@ -676,7 +676,7 @@ function EmailSectionInner({ open, onToggle, }) {
         if (vars.length)
             save(vars);
     };
-    return (_jsx(SettingsSection, { icon: _jsx(IconMail, { size: 14 }), title: "Email", subtitle: "Needed before deploy for password resets, team invitations, share notifications, and dashboard email reports. Local development can run without it.", connected: !envLoaded ? undefined : anyConfigured, open: open, onToggle: onToggle, children: !envLoaded ? (_jsx(SettingsSkeleton, { lines: 2 })) : (_jsxs("div", { className: "space-y-2", children: [_jsxs("label", { className: "block space-y-1", children: [_jsx("span", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Provider" }), _jsxs("select", { value: emailProvider, onChange: (e) => setEmailProvider(e.target.value), className: "w-full rounded border border-border bg-background px-2 py-1 text-[11px] text-foreground outline-none focus:ring-1 focus:ring-accent", children: [_jsx("option", { value: "resend", children: "Resend" }), _jsx("option", { value: "sendgrid", children: "SendGrid" })] })] }), emailProvider === "resend" ? (_jsxs(ManualSetupCard, { hint: "Use Resend for transactional email.", docsUrl: "https://resend.com/api-keys", docsLabel: "Get a Resend key", children: [resendConfigured ? (_jsxs("div", { className: "mb-1 flex items-center gap-1.5 text-[10px] text-green-500", children: [_jsx(IconCheck, { size: 10 }), "RESEND_API_KEY configured"] })) : (_jsxs("div", { className: "mb-1 flex gap-1.5", children: [_jsx("input", { type: "password", value: resendKey, onChange: (e) => setResendKey(e.target.value), onKeyDown: (e) => {
+    return (_jsx(SettingsSection, { id: settingsSectionDomId("email"), icon: _jsx(IconMail, { size: 14 }), title: "Email", subtitle: "Needed before deploy for password resets, team invitations, share notifications, and dashboard email reports. Local development can run without it.", connected: !envLoaded ? undefined : anyConfigured, open: open, onToggle: onToggle, children: !envLoaded ? (_jsx(SettingsSkeleton, { lines: 2 })) : (_jsxs("div", { className: "space-y-2", children: [_jsxs("label", { className: "block space-y-1", children: [_jsx("span", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Provider" }), _jsxs("select", { value: emailProvider, onChange: (e) => setEmailProvider(e.target.value), className: "w-full rounded border border-border bg-background px-2 py-1 text-[11px] text-foreground outline-none focus:ring-1 focus:ring-accent", children: [_jsx("option", { value: "resend", children: "Resend" }), _jsx("option", { value: "sendgrid", children: "SendGrid" })] })] }), emailProvider === "resend" ? (_jsxs(ManualSetupCard, { hint: "Use Resend for transactional email.", docsUrl: "https://resend.com/api-keys", docsLabel: "Get a Resend key", children: [resendConfigured ? (_jsxs("div", { className: "mb-1 flex items-center gap-1.5 text-[10px] text-green-500", children: [_jsx(IconCheck, { size: 10 }), "RESEND_API_KEY configured"] })) : (_jsxs("div", { className: "mb-1 flex gap-1.5", children: [_jsx("input", { type: "password", value: resendKey, onChange: (e) => setResendKey(e.target.value), onKeyDown: (e) => {
                                         if (e.key === "Enter")
                                             saveResend();
                                     }, placeholder: "re_...", className: "flex-1 rounded border border-border bg-background px-2 py-1 text-[11px] text-foreground outline-none placeholder:text-muted-foreground/50 focus:ring-1 focus:ring-accent" }), _jsx("button", { onClick: saveResend, disabled: !resendKey.trim() || saving, className: "rounded bg-accent px-2 py-1 text-[10px] font-medium text-foreground hover:bg-accent/80 disabled:opacity-40", children: saving ? (_jsx(IconLoader2, { size: 10, className: "animate-spin" })) : saved ? (_jsx(IconCheck, { size: 10 })) : ("Save") })] })), fromConfigured ? (_jsxs("div", { className: "flex items-center gap-1.5 text-[10px] text-green-500", children: [_jsx(IconCheck, { size: 10 }), "EMAIL_FROM configured"] })) : (_jsxs("div", { className: "flex gap-1.5", children: [_jsx("input", { type: "text", value: fromAddr, onChange: (e) => setFromAddr(e.target.value), onKeyDown: (e) => {
@@ -791,7 +791,7 @@ function AgentLimitsSectionInner({ open, onToggle, }) {
             setSaving(false);
         }
     };
-    return (_jsx(SettingsSection, { icon: _jsx(IconGauge, { size: 14 }), title: "Agent Limits", subtitle: "Control how long a single agent response can work before pausing.", connected: loading
+    return (_jsx(SettingsSection, { id: settingsSectionDomId("limits"), icon: _jsx(IconGauge, { size: 14 }), title: "Agent Limits", subtitle: "Control how long a single agent response can work before pausing.", connected: loading
             ? undefined
             : settings
                 ? settings.maxIterations !== settings.defaultMaxIterations
@@ -869,6 +869,95 @@ const WORKSPACE_SETTINGS_SECTIONS = [
     "uploads",
     "auth",
 ];
+// Search metadata for each section so settings search can deep-link straight
+// to a section from any tab. Labels mirror the section headers; keywords add
+// synonyms and provider names the header doesn't spell out.
+const SETTINGS_SECTION_SEARCH_META = {
+    account: {
+        label: "Account",
+        keywords: "profile photo avatar identity signed in email name",
+    },
+    llm: {
+        label: "LLM",
+        keywords: "model claude gpt openai anthropic gemini api key provider ai engine llm",
+    },
+    "app-models": {
+        label: "App Default Model",
+        keywords: "default model provider app template composer",
+    },
+    limits: {
+        label: "Agent Limits",
+        keywords: "max iterations budget loop timeout runtime",
+    },
+    voice: {
+        label: "Voice Transcription",
+        keywords: "microphone dictation speech to text whisper",
+    },
+    "demo-mode": {
+        label: "Demo mode",
+        keywords: "fake data anonymize redact screenshot privacy mask",
+    },
+    automations: {
+        label: "Automations",
+        keywords: "triggers scheduled events cron jobs",
+    },
+    secrets: {
+        label: "API Keys & Connections",
+        keywords: "secrets credentials tokens api keys environment variables",
+    },
+    hosting: {
+        label: "Hosting",
+        keywords: "deploy netlify vercel cloudflare builder nitro",
+    },
+    database: {
+        label: "Database",
+        keywords: "postgres sqlite neon supabase turso storage sql pglite",
+    },
+    uploads: {
+        label: "File uploads",
+        keywords: "files storage s3 avatars attachments bucket blob",
+    },
+    auth: {
+        label: "Authentication",
+        keywords: "login signup oauth google github better auth access sso",
+    },
+    email: {
+        label: "Email",
+        keywords: "resend sendgrid smtp transactional notifications reports",
+    },
+    browser: {
+        label: "Browser Automation",
+        keywords: "web scraping playwright chrome headless",
+    },
+    background: {
+        label: "Background Agent",
+        keywords: "code changes branches builder production async",
+    },
+    integrations: {
+        label: "Integrations",
+        keywords: "slack telegram whatsapp discord messaging connect",
+    },
+    usage: {
+        label: "Usage",
+        keywords: "tokens cost spend billing consumption",
+    },
+    a2a: {
+        label: "Connected Agents (A2A)",
+        keywords: "remote agents protocol a2a connected",
+    },
+};
+function buildSectionSearchEntries(sections) {
+    return sections.map((section) => {
+        const meta = SETTINGS_SECTION_SEARCH_META[section];
+        return {
+            id: `section:${section}`,
+            label: meta.label,
+            keywords: meta.keywords,
+            description: meta.description,
+            hash: section,
+        };
+    });
+}
 function normalizeSettingsSection(value) {
     const normalized = value?.replace(/^#/, "").toLowerCase() ?? "";
     if (!normalized)
@@ -966,7 +1055,7 @@ function AccountSectionInner({ open, onToggle, }) {
             setUploading(false);
         }
     };
-    return (_jsx(SettingsSection, { icon: _jsx(IconUserCircle, { size: 14 }), title: "Account", subtitle: "Your profile photo and signed-in identity.", open: open, onToggle: onToggle, children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden rounded-full border border-border bg-accent text-[13px] font-semibold text-muted-foreground", children: avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "h-full w-full object-cover" })) : (initials) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-[12px] font-medium text-foreground", children: isLoading ? "Loading..." : displayName }), email && (_jsx("p", { className: "truncate text-[11px] text-muted-foreground", children: email })), status === "saved" && (_jsx("p", { className: "mt-1 text-[11px] text-green-600 dark:text-green-400", children: "Photo updated" })), status === "error" && (_jsx("p", { className: "mt-1 text-[11px] text-destructive", children: "Could not update photo" }))] }), _jsx("input", { ref: fileInputRef, type: "file", accept: "image/*", className: "hidden", onChange: handleAvatarChange }), _jsx("button", { type: "button", disabled: !email || uploading, onClick: () => fileInputRef.current?.click(), className: "inline-flex h-8 shrink-0 items-center justify-center rounded-md border border-border bg-background px-3 text-[12px] font-medium text-foreground transition-colors hover:bg-accent/50 disabled:cursor-not-allowed disabled:opacity-50", children: uploading ? "Uploading..." : "Change photo" })] }) }));
+    return (_jsx(SettingsSection, { id: settingsSectionDomId("account"), icon: _jsx(IconUserCircle, { size: 14 }), title: "Account", subtitle: "Your profile photo and signed-in identity.", open: open, onToggle: onToggle, children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center overflow-hidden rounded-full border border-border bg-accent text-[13px] font-semibold text-muted-foreground", children: avatarUrl ? (_jsx("img", { src: avatarUrl, alt: "", className: "h-full w-full object-cover" })) : (initials) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-[12px] font-medium text-foreground", children: isLoading ? "Loading..." : displayName }), email && (_jsx("p", { className: "truncate text-[11px] text-muted-foreground", children: email })), status === "saved" && (_jsx("p", { className: "mt-1 text-[11px] text-green-600 dark:text-green-400", children: "Photo updated" })), status === "error" && (_jsx("p", { className: "mt-1 text-[11px] text-destructive", children: "Could not update photo" }))] }), _jsx("input", { ref: fileInputRef, type: "file", accept: "image/*", className: "hidden", onChange: handleAvatarChange }), _jsx("button", { type: "button", disabled: !email || uploading, onClick: () => fileInputRef.current?.click(), className: "inline-flex h-8 shrink-0 items-center justify-center rounded-md border border-border bg-background px-3 text-[12px] font-medium text-foreground transition-colors hover:bg-accent/50 disabled:cursor-not-allowed disabled:opacity-50", children: uploading ? "Uploading..." : "Change photo" })] }) }));
 }
 function SettingsPanelContent({ isDevMode, onToggleDevMode, showDevToggle, devAppUrl, initialSection, sectionRequestKey, sections = ALL_SETTINGS_SECTIONS, showCapabilityStrip = true, className, }) {
     const { status: builder, loading: builderLoading } = useBuilderStatus();
@@ -1046,7 +1135,7 @@ function SettingsPanelContent({ isDevMode, onToggleDevMode, showDevToggle, devAp
                         const nextIsDev = next === "development";
                         if (nextIsDev !== isDevMode)
                             onToggleDevMode();
-                    } })) })), showCapabilityStrip && (_jsx(CapabilityStatusStrip, { isDevMode: isDevMode, builderConnected: connected, builderLoading: builderLoading, builderBranchesAvailable: builderBranchesAvailable, onOpenLlm: () => openSettingsSection("llm", true) })), shouldShowSection("account") && (_jsx(AccountSectionInner, { open: openSection === "account", onToggle: () => toggle("account") })), shouldShowSection("llm") && (_jsx(LLMSectionInner, { builderFlow: builderFlow, builderLoading: builderLoading, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, open: openSection === "llm", onToggle: () => toggle("llm") })), shouldShowSection("app-models") && (_jsx(AppModelDefaultsSectionInner, { open: openSection === "app-models", onToggle: () => toggle("app-models") })), shouldShowSection("limits") && (_jsx(AgentLimitsSectionInner, { open: openSection === "limits", onToggle: () => toggle("limits") })), shouldShowSection("voice") && (_jsx(SettingsSection, { icon: _jsx(IconMicrophone, { size: 14 }), title: "Voice Transcription", subtitle: "How the composer microphone turns your voice into text.", open: openSection === "voice", onToggle: () => toggle("voice"), children: _jsx(VoiceTranscriptionSection, {}) })), shouldShowSection("demo-mode") && (_jsx(SettingsSection, { icon: _jsx(IconEyeOff, { size: 14 }), title: "Demo mode", subtitle: "Replace names, emails, and numbers with realistic fake data everywhere \u2014 in the UI and what the agent sees. IDs and structure are preserved so the app keeps working.", open: openSection === "demo-mode", onToggle: () => toggle("demo-mode"), children: _jsx(DemoModeSection, {}) })), shouldShowSection("automations") && (_jsx(SettingsSection, { icon: _jsx(IconBolt, { size: 14 }), title: "Automations", subtitle: "Event-triggered and scheduled automations.", open: openSection === "automations", onToggle: () => toggle("automations"), children: _jsx(AutomationsSection, {}) })), shouldShowSection("secrets") && (_jsx(SettingsSection, { id: settingsSectionDomId("secrets"), icon: _jsx(IconKey, { size: 14 }), title: "API Keys & Connections", subtitle: "Service credentials and automation keys.", open: openSection === "secrets", onToggle: () => toggle("secrets"), children: _jsx(SecretsSection, { focusKey: focusSecretKey }) })), shouldShowSection("hosting") && (_jsx(SettingsSection, { icon: _jsx(IconCloud, { size: 14 }), title: "Hosting", subtitle: "Deploy your app to the cloud.", connected: connected, open: openSection === "hosting", onToggle: () => toggle("hosting"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "hosting_settings", trackingFlow: "hosting" }), _jsx(ManualSetupCard, { hint: "Deploy manually to Netlify, Vercel, Cloudflare, or any Nitro-supported target.", docsUrl: "https://www.builder.io/c/docs/agent-native-deployment", dim: connected })] }) })), shouldShowSection("database") && (_jsx(SettingsSection, { icon: _jsx(IconDatabase, { size: 14 }), title: "Database", subtitle: "Connect a cloud database for persistent storage.", connected: connected, open: openSection === "database", onToggle: () => toggle("database"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "database_settings", trackingFlow: "database" }), _jsx(ManualSetupCard, { hint: "Set DATABASE_URL in your .env to connect Neon, Supabase, Turso, any Postgres/SQLite database, or local PGlite with pglite:./data/pglite.", docsUrl: "https://www.builder.io/c/docs/agent-native-database", dim: connected })] }) })), shouldShowSection("uploads") && (_jsx(SettingsSection, { icon: _jsx(IconUpload, { size: 14 }), title: "File uploads", subtitle: "Where user-uploaded files (avatars, chat attachments) are stored.", connected: connected, open: openSection === "uploads", onToggle: () => toggle("uploads"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "file_upload_settings", trackingFlow: "file_upload" }), _jsx(ManualSetupCard, { hint: "Without a provider, files are stored as base64 in your database. Fine for dev, not recommended for production.", docsUrl: "https://www.builder.io/c/docs/agent-native-file-uploads", dim: connected })] }) })), shouldShowSection("auth") && (_jsx(SettingsSection, { icon: _jsx(IconShield, { size: 14 }), title: "Authentication", subtitle: "Set up user authentication and access control.", connected: connected, open: openSection === "auth", onToggle: () => toggle("auth"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "auth_settings", trackingFlow: "auth" }), _jsx(ManualSetupCard, { hint: "Configure Better Auth with BETTER_AUTH_SECRET and optional Google/GitHub OAuth providers.", docsUrl: "https://www.builder.io/c/docs/agent-native-authentication", dim: connected })] }) })), shouldShowSection("email") && (_jsx(EmailSectionInner, { open: openSection === "email", onToggle: () => toggle("email") })), shouldShowSection("browser") && (_jsx(SettingsSection, { icon: _jsx(IconBrowser, { size: 14 }), title: "Browser Automation", subtitle: "Let agents control a real browser for web tasks.", connected: connected, open: openSection === "browser", onToggle: () => toggle("browser"), children: _jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "browser_settings", trackingFlow: "browser_automation" }) })), builderBranchesAvailable && shouldShowSection("background") && (_jsx(SettingsSection, { icon: _jsx(IconGitBranch, { size: 14 }), title: "Background Agent", subtitle: "Make code changes from production mode via Builder.", connected: connected, open: openSection === "background", onToggle: () => toggle("background"), children: _jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "background_agent_settings", trackingFlow: "background_agent" }) })), shouldShowSection("integrations") && (_jsx(SettingsSection, { icon: _jsx(IconPlugConnected, { size: 14 }), title: "Integrations", subtitle: "Connect messaging platforms and external services.", open: openSection === "integrations", onToggle: () => toggle("integrations"), children: _jsx(Suspense, { fallback: null, children: _jsx(IntegrationsPanel, {}) }) })), shouldShowSection("usage") && (_jsx(SettingsSection, { icon: _jsx(IconCoin, { size: 14 }), title: "Usage", subtitle: "Track token consumption and estimated cost \u2014 broken down by chat, automations, and background jobs.", open: openSection === "usage", onToggle: () => toggle("usage"), children: _jsx(UsageSection, {}) })), shouldShowSection("a2a") && (_jsx(SettingsSection, { icon: _jsx(IconTopologyRing2, { size: 14 }), title: "Connected Agents (A2A)", subtitle: "Manage remote agents connected via the A2A protocol.", open: openSection === "a2a", onToggle: () => toggle("a2a"), children: _jsx(AgentsSection, {}) }))] }));
+                    } })) })), showCapabilityStrip && (_jsx(CapabilityStatusStrip, { isDevMode: isDevMode, builderConnected: connected, builderLoading: builderLoading, builderBranchesAvailable: builderBranchesAvailable, onOpenLlm: () => openSettingsSection("llm", true) })), shouldShowSection("account") && (_jsx(AccountSectionInner, { open: openSection === "account", onToggle: () => toggle("account") })), shouldShowSection("llm") && (_jsx(LLMSectionInner, { builderFlow: builderFlow, builderLoading: builderLoading, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, open: openSection === "llm", onToggle: () => toggle("llm") })), shouldShowSection("app-models") && (_jsx(AppModelDefaultsSectionInner, { open: openSection === "app-models", onToggle: () => toggle("app-models") })), shouldShowSection("limits") && (_jsx(AgentLimitsSectionInner, { open: openSection === "limits", onToggle: () => toggle("limits") })), shouldShowSection("voice") && (_jsx(SettingsSection, { id: settingsSectionDomId("voice"), icon: _jsx(IconMicrophone, { size: 14 }), title: "Voice Transcription", subtitle: "How the composer microphone turns your voice into text.", open: openSection === "voice", onToggle: () => toggle("voice"), children: _jsx(VoiceTranscriptionSection, {}) })), shouldShowSection("demo-mode") && (_jsx(SettingsSection, { id: settingsSectionDomId("demo-mode"), icon: _jsx(IconEyeOff, { size: 14 }), title: "Demo mode", subtitle: "Replace names, emails, and numbers with realistic fake data everywhere \u2014 in the UI and what the agent sees. IDs and structure are preserved so the app keeps working.", open: openSection === "demo-mode", onToggle: () => toggle("demo-mode"), children: _jsx(DemoModeSection, {}) })), shouldShowSection("automations") && (_jsx(SettingsSection, { id: settingsSectionDomId("automations"), icon: _jsx(IconBolt, { size: 14 }), title: "Automations", subtitle: "Event-triggered and scheduled automations.", open: openSection === "automations", onToggle: () => toggle("automations"), children: _jsx(AutomationsSection, {}) })), shouldShowSection("secrets") && (_jsx(SettingsSection, { id: settingsSectionDomId("secrets"), icon: _jsx(IconKey, { size: 14 }), title: "API Keys & Connections", subtitle: "Service credentials and automation keys.", open: openSection === "secrets", onToggle: () => toggle("secrets"), children: _jsx(SecretsSection, { focusKey: focusSecretKey }) })), shouldShowSection("hosting") && (_jsx(SettingsSection, { id: settingsSectionDomId("hosting"), icon: _jsx(IconCloud, { size: 14 }), title: "Hosting", subtitle: "Deploy your app to the cloud.", connected: connected, open: openSection === "hosting", onToggle: () => toggle("hosting"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "hosting_settings", trackingFlow: "hosting" }), _jsx(ManualSetupCard, { hint: "Deploy manually to Netlify, Vercel, Cloudflare, or any Nitro-supported target.", docsUrl: "https://www.builder.io/c/docs/agent-native-deployment", dim: connected })] }) })), shouldShowSection("database") && (_jsx(SettingsSection, { id: settingsSectionDomId("database"), icon: _jsx(IconDatabase, { size: 14 }), title: "Database", subtitle: "Connect a cloud database for persistent storage.", connected: connected, open: openSection === "database", onToggle: () => toggle("database"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "database_settings", trackingFlow: "database" }), _jsx(ManualSetupCard, { hint: "Set DATABASE_URL in your .env to connect Neon, Supabase, Turso, any Postgres/SQLite database, or local PGlite with pglite:./data/pglite.", docsUrl: "https://www.builder.io/c/docs/agent-native-database", dim: connected })] }) })), shouldShowSection("uploads") && (_jsx(SettingsSection, { id: settingsSectionDomId("uploads"), icon: _jsx(IconUpload, { size: 14 }), title: "File uploads", subtitle: "Where user-uploaded files (avatars, chat attachments) are stored.", connected: connected, open: openSection === "uploads", onToggle: () => toggle("uploads"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "file_upload_settings", trackingFlow: "file_upload" }), _jsx(ManualSetupCard, { hint: "Without a provider, files are stored as base64 in your database. Fine for dev, not recommended for production.", docsUrl: "https://www.builder.io/c/docs/agent-native-file-uploads", dim: connected })] }) })), shouldShowSection("auth") && (_jsx(SettingsSection, { id: settingsSectionDomId("auth"), icon: _jsx(IconShield, { size: 14 }), title: "Authentication", subtitle: "Set up user authentication and access control.", connected: connected, open: openSection === "auth", onToggle: () => toggle("auth"), children: _jsxs("div", { className: "space-y-2", children: [_jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "auth_settings", trackingFlow: "auth" }), _jsx(ManualSetupCard, { hint: "Configure Better Auth with BETTER_AUTH_SECRET and optional Google/GitHub OAuth providers.", docsUrl: "https://www.builder.io/c/docs/agent-native-authentication", dim: connected })] }) })), shouldShowSection("email") && (_jsx(EmailSectionInner, { open: openSection === "email", onToggle: () => toggle("email") })), shouldShowSection("browser") && (_jsx(SettingsSection, { id: settingsSectionDomId("browser"), icon: _jsx(IconBrowser, { size: 14 }), title: "Browser Automation", subtitle: "Let agents control a real browser for web tasks.", connected: connected, open: openSection === "browser", onToggle: () => toggle("browser"), children: _jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "browser_settings", trackingFlow: "browser_automation" }) })), builderBranchesAvailable && shouldShowSection("background") && (_jsx(SettingsSection, { id: settingsSectionDomId("background"), icon: _jsx(IconGitBranch, { size: 14 }), title: "Background Agent", subtitle: "Make code changes from production mode via Builder.", connected: connected, open: openSection === "background", onToggle: () => toggle("background"), children: _jsx(UseBuilderCard, { builderFlow: builderFlow, connectUrl: connectUrl, connected: connected, orgName: orgName, envManaged: envManaged, credentialSource: credentialSource, trackingSource: "background_agent_settings", trackingFlow: "background_agent" }) })), shouldShowSection("integrations") && (_jsx(SettingsSection, { id: settingsSectionDomId("integrations"), icon: _jsx(IconPlugConnected, { size: 14 }), title: "Integrations", subtitle: "Connect messaging platforms and external services.", open: openSection === "integrations", onToggle: () => toggle("integrations"), children: _jsx(Suspense, { fallback: null, children: _jsx(IntegrationsPanel, {}) }) })), shouldShowSection("usage") && (_jsx(SettingsSection, { id: settingsSectionDomId("usage"), icon: _jsx(IconCoin, { size: 14 }), title: "Usage", subtitle: "Track token consumption and estimated cost \u2014 broken down by chat, automations, and background jobs.", open: openSection === "usage", onToggle: () => toggle("usage"), children: _jsx(UsageSection, {}) })), shouldShowSection("a2a") && (_jsx(SettingsSection, { id: settingsSectionDomId("a2a"), icon: _jsx(IconTopologyRing2, { size: 14 }), title: "Connected Agents (A2A)", subtitle: "Manage remote agents connected via the A2A protocol.", open: openSection === "a2a", onToggle: () => toggle("a2a"), children: _jsx(AgentsSection, {}) }))] }));
 }
 export function SettingsPanel(props) {
     return _jsx(SettingsPanelContent, { ...props });
@@ -1065,18 +1154,24 @@ export function useAgentSettingsTabs() {
             id: "agent",
             label: "Agent",
             icon: IconBrain,
+            keywords: "agent model llm limits voice automations",
+            searchEntries: buildSectionSearchEntries(AGENT_SETTINGS_SECTIONS),
             content: (_jsx(SettingsPanelContent, { ...baseProps, sections: AGENT_SETTINGS_SECTIONS, showCapabilityStrip: false, className: "mx-auto w-full max-w-3xl p-0" })),
         },
         {
             id: "connections",
             label: "Connections",
             icon: IconPlugConnected,
+            keywords: "connections secrets integrations email browser usage",
+            searchEntries: buildSectionSearchEntries(CONNECTION_SETTINGS_SECTIONS),
             content: (_jsx(SettingsPanelContent, { ...baseProps, sections: CONNECTION_SETTINGS_SECTIONS, showCapabilityStrip: false, className: "mx-auto w-full max-w-3xl p-0" })),
         },
         {
             id: "workspace",
             label: "Workspace",
             icon: IconCloud,
+            keywords: "workspace account hosting database uploads auth",
+            searchEntries: buildSectionSearchEntries(WORKSPACE_SETTINGS_SECTIONS),
             content: (_jsx(SettingsPanelContent, { ...baseProps, sections: WORKSPACE_SETTINGS_SECTIONS, showCapabilityStrip: false, className: "mx-auto w-full max-w-3xl p-0" })),
         },
     ], [baseProps]);