@qredence/fleet 0.6.0 → 0.6.1

package/dist/web/server/{settings-dialog-DndPbM-v-RFNXXEAN.js → settings-dialog-CK0FJlTg-HZRBAXDZ.js}

@@ -24,7 +24,7 @@ import {
   useHoverInteractionSharedState,
   useHoverReferenceInteraction,
   usePopupHandleStore
-} from "./chunk-TWYHHG5N.js";
+} from "./chunk-2JHTYWD5.js";
 import {
   UI_PREFERENCES_KEY,
   isModelPatternEnabled,
@@ -56,11 +56,11 @@ import {
 } from "./chunk-OKL5ZRVB.js";
 import {
   notify
-} from "./chunk-WYL2DW5R.js";
+} from "./chunk-JTCCQZLN.js";
 import {
   FloatingPortalLite,
   Info
-} from "./chunk-KOUEJ3NU.js";
+} from "./chunk-UL2725KQ.js";
 import "./chunk-UCA4WN66.js";
 import {
   Eye
@@ -84,7 +84,7 @@ import {
   InputGroupButton,
   InputGroupInput,
   Textarea
-} from "./chunk-PIOFZUOU.js";
+} from "./chunk-NJ4QEZHK.js";
 import {
   Search
 } from "./chunk-JIULUYHT.js";
@@ -105,7 +105,7 @@ import {
   FieldGroup,
   FieldLabel,
   Switch
-} from "./chunk-UAPNEWCA.js";
+} from "./chunk-KP2PNDGL.js";
 import {
   Select,
   clamp,
@@ -117,7 +117,7 @@ import {
   useDirection,
   usePositioner,
   useRender
-} from "./chunk-WM4PUT6M.js";
+} from "./chunk-NNKJTKOQ.js";
 import {
   isCustomProviderId,
   isNamedOccInstanceId,
@@ -126,7 +126,7 @@ import {
 import "./chunk-WWJF4RO2.js";
 import {
   Input
-} from "./chunk-P6UMR32I.js";
+} from "./chunk-5UCAJBAH.js";
 import {
   Dialog,
   DialogBackdrop,
@@ -160,7 +160,7 @@ import {
   usePopupRootStore,
   useSurface,
   useTriggerDataForwarding
-} from "./chunk-AGFRJQZ7.js";
+} from "./chunk-4WBFCB4O.js";
 import {
   Button,
   POPUP_COLLISION_AVOIDANCE,
@@ -181,7 +181,7 @@ import {
   ownerDocument,
   useTimeout,
   webkit
-} from "./chunk-LZ4Q5KUJ.js";
+} from "./chunk-WNCAL4HN.js";
 import {
   Check
 } from "./chunk-4QD4PCVP.js";
@@ -189,7 +189,7 @@ import "./chunk-S3PQ6HKH.js";
 import {
   useBaseUiId,
   useValueAsRef
-} from "./chunk-7SR6WDM2.js";
+} from "./chunk-MNBGB2SP.js";
 import {
   X
 } from "./chunk-JBLHIEVG.js";
@@ -212,7 +212,7 @@ import {
   useOpenChangeComplete,
   useRenderElement,
   useStableCallback
-} from "./chunk-C5X6G26O.js";
+} from "./chunk-XIB6XNUX.js";
 import {
   Plug
 } from "./chunk-AHTO6GDS.js";
@@ -228,7 +228,7 @@ import "./chunk-JDCCC7A7.js";
 import "./chunk-L547YHC4.js";
 import "./chunk-MLKGABMK.js";
 
-// web/app/dist/server/assets/settings-dialog-DndPbM-v.js
+// web/app/dist/server/assets/settings-dialog-CK0FJlTg.js
 import * as React$1 from "react";
 import { useCallback as useCallback2, useEffect as useEffect2, useId, useMemo as useMemo2, useRef as useRef2, useState as useState2 } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -722,6 +722,46 @@ function useFocus(context, props = {}) {
     trigger: reference
   } : {}, [enabled, reference]);
 }
+function Breadcrumb({ className, ...props }) {
+  return /* @__PURE__ */ jsx("nav", {
+    "aria-label": "breadcrumb",
+    "data-slot": "breadcrumb",
+    className: cn(className),
+    ...props
+  });
+}
+function BreadcrumbList({ className, ...props }) {
+  return /* @__PURE__ */ jsx("ol", {
+    "data-slot": "breadcrumb-list",
+    className: cn("flex flex-wrap items-center gap-1.5 text-sm wrap-break-word text-muted-foreground", className),
+    ...props
+  });
+}
+function BreadcrumbItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx("li", {
+    "data-slot": "breadcrumb-item",
+    className: cn("inline-flex items-center gap-1", className),
+    ...props
+  });
+}
+function BreadcrumbPage({ className, ...props }) {
+  return /* @__PURE__ */ jsx("span", {
+    "data-slot": "breadcrumb-page",
+    "aria-current": "page",
+    className: cn("font-normal text-foreground", className),
+    ...props
+  });
+}
+function BreadcrumbSeparator({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx("li", {
+    "data-slot": "breadcrumb-separator",
+    role: "presentation",
+    "aria-hidden": "true",
+    className: cn("[&>svg]:size-3.5", className),
+    ...props,
+    children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
+  });
+}
 var ScrollAreaRootContext = /* @__PURE__ */ React$1.createContext(void 0);
 function useScrollAreaRootContext() {
   const context = React$1.useContext(ScrollAreaRootContext);
@@ -1414,46 +1454,6 @@ function ScrollBar({ className, orientation = "vertical", ...props }) {
     })
   });
 }
-function Breadcrumb({ className, ...props }) {
-  return /* @__PURE__ */ jsx("nav", {
-    "aria-label": "breadcrumb",
-    "data-slot": "breadcrumb",
-    className: cn(className),
-    ...props
-  });
-}
-function BreadcrumbList({ className, ...props }) {
-  return /* @__PURE__ */ jsx("ol", {
-    "data-slot": "breadcrumb-list",
-    className: cn("flex flex-wrap items-center gap-1.5 text-sm wrap-break-word text-muted-foreground", className),
-    ...props
-  });
-}
-function BreadcrumbItem({ className, ...props }) {
-  return /* @__PURE__ */ jsx("li", {
-    "data-slot": "breadcrumb-item",
-    className: cn("inline-flex items-center gap-1", className),
-    ...props
-  });
-}
-function BreadcrumbPage({ className, ...props }) {
-  return /* @__PURE__ */ jsx("span", {
-    "data-slot": "breadcrumb-page",
-    "aria-current": "page",
-    className: cn("font-normal text-foreground", className),
-    ...props
-  });
-}
-function BreadcrumbSeparator({ children, className, ...props }) {
-  return /* @__PURE__ */ jsx("li", {
-    "data-slot": "breadcrumb-separator",
-    role: "presentation",
-    "aria-hidden": "true",
-    className: cn("[&>svg]:size-3.5", className),
-    ...props,
-    children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
-  });
-}
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
   const [isMobile, setIsMobile] = React$1.useState(void 0);
@@ -2253,42 +2253,6 @@ function SidebarMenuButton({ render, isActive = false, variant = "default", size
     ...tooltip
   })] });
 }
-var THEME_OPTIONS = [
-  {
-    value: "system",
-    label: "System",
-    icon: Monitor
-  },
-  {
-    value: "light",
-    label: "Light",
-    icon: Sun
-  },
-  {
-    value: "dark",
-    label: "Dark",
-    icon: Moon
-  }
-];
-function PersonalizationSection({ onThemePreferenceChange, themePreference }) {
-  return /* @__PURE__ */ jsxs(Field, {
-    orientation: "horizontal",
-    className: "items-center justify-between gap-6 rounded-xl border p-4",
-    children: [/* @__PURE__ */ jsxs("div", {
-      className: "min-w-0",
-      children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Theme" }), /* @__PURE__ */ jsx(FieldDescription, { children: "Match the system theme or pick light or dark." })]
-    }), /* @__PURE__ */ jsx("div", {
-      className: "shrink-0",
-      children: /* @__PURE__ */ jsx(Select, {
-        "aria-label": "Theme",
-        className: "w-[160px]",
-        onValueChange: (value) => onThemePreferenceChange(value),
-        options: [...THEME_OPTIONS],
-        value: themePreference
-      })
-    })]
-  });
-}
 function RowSurface({ className, interactive, padding, tone, ...props }) {
   return /* @__PURE__ */ jsx("div", {
     className: cn(fleetPiRowSurface({
@@ -2589,14 +2553,10 @@ function ProviderOAuthSignIn({ onConfigured, onOAuthLogin, provider }) {
         }),
         userCode ? /* @__PURE__ */ jsxs("p", {
           className: "text-sm",
-          children: [
-            "Enter this code:",
-            " ",
-            /* @__PURE__ */ jsx("span", {
-              className: "font-mono text-foreground",
-              children: userCode
-            })
-          ]
+          children: ["Enter this code: ", /* @__PURE__ */ jsx("span", {
+            className: "font-mono text-foreground",
+            children: userCode
+          })]
         }) : null,
         instructions && !userCode ? /* @__PURE__ */ jsx("p", {
           className: "text-xs text-pretty text-muted-foreground",
@@ -2980,1374 +2940,1299 @@ function McpConnectionsSection({ connections, isLoading, isPending, onOAuth, onR
     ]
   });
 }
-function isFieldInvalid(value, attemptedSave, required = true) {
-  return attemptedSave && required && value.trim().length === 0;
+function customModelKey(provider, model) {
+  return `${provider}/${model}`;
 }
-function SecretCredentialField({ attemptedSave, label, onChange, onToggleVisibility, placeholder, required = true, showPassword, value }) {
-  const controlId = useId();
-  const invalid = isFieldInvalid(value, attemptedSave, required);
-  return /* @__PURE__ */ jsxs(Field, {
-    "data-invalid": invalid || void 0,
-    children: [/* @__PURE__ */ jsx(FieldLabel, {
-      htmlFor: controlId,
-      children: label
-    }), /* @__PURE__ */ jsxs(InputGroup, { children: [
-      /* @__PURE__ */ jsx(InputGroupAddon, {
-        align: "inline-start",
-        children: /* @__PURE__ */ jsx(Lock, {})
-      }),
-      /* @__PURE__ */ jsx(InputGroupInput, {
-        id: controlId,
-        type: showPassword ? "text" : "password",
-        placeholder,
-        value,
-        onChange: (event) => onChange(event.target.value),
-        "aria-label": label,
-        "aria-invalid": invalid || void 0
-      }),
-      /* @__PURE__ */ jsx(InputGroupAddon, {
-        align: "inline-end",
-        children: /* @__PURE__ */ jsx(InputGroupButton, {
-          size: "icon-xs",
-          className: cn(HIT_AREA_EXPAND_CLASS, "transition-[background-color,transform] duration-150 active:scale-[0.96]"),
-          "aria-label": showPassword ? "Hide value" : "Show value",
-          onClick: onToggleVisibility,
-          children: showPassword ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {})
-        })
-      })
-    ] })]
-  });
+function isModelEnabled(model, patterns) {
+  return isModelPatternEnabled({
+    id: model.id,
+    name: model.name,
+    provider: model.provider,
+    modelId: model.modelId
+  }, patterns);
 }
-function TextCredentialField({ attemptedSave, icon: Icon, inputType = "text", label, onChange, placeholder, required = true, value }) {
-  const controlId = useId();
-  const invalid = isFieldInvalid(value, attemptedSave, required);
-  return /* @__PURE__ */ jsxs(Field, {
-    "data-invalid": invalid || void 0,
-    children: [/* @__PURE__ */ jsx(FieldLabel, {
-      htmlFor: controlId,
-      children: label
-    }), /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, {
-      align: "inline-start",
-      children: /* @__PURE__ */ jsx(Icon, {})
-    }), /* @__PURE__ */ jsx(InputGroupInput, {
-      id: controlId,
-      type: inputType,
-      placeholder,
-      value,
-      onChange: (event) => onChange(event.target.value),
-      "aria-label": label,
-      "aria-invalid": invalid || void 0
-    })] })]
-  });
+function nextEnabledModelPatterns({ currentPatterns, enabled, model, models }) {
+  if (currentPatterns === void 0 && enabled) return void 0;
+  const current = currentPatterns ?? [];
+  const knownModelPatterns = new Set(models.map((item) => modelPatternFor(item)));
+  const activeKnown = /* @__PURE__ */ new Set();
+  for (const item of models) if (isModelEnabled(item, currentPatterns)) activeKnown.add(modelPatternFor(item));
+  if (enabled) activeKnown.add(modelPatternFor(model));
+  else activeKnown.delete(modelPatternFor(model));
+  return [...current.filter((pattern) => {
+    if (knownModelPatterns.has(pattern)) return false;
+    return enabled || !modelMatchesPattern(model, pattern);
+  }), ...activeKnown];
 }
-var OPENAI_CHAT_BASE_URL_PLACEHOLDER = "https://opencode.ai/zen/v1";
-var OPENAI_CHAT_MODEL_PLACEHOLDER = "qwen35-122b-a10b";
-var OPENAI_CHAT_NAME_PLACEHOLDER = "e.g. OpenCode Zen, Nebius, Groq\u2026";
-var CUSTOM_MODELS_PLACEHOLDER = "model-a, model-b (comma-separated)";
-var CUSTOM_PROVIDER_API_OPTIONS = [
-  {
-    value: "openai-completions",
-    label: "OpenAI Chat Completions"
-  },
-  {
-    value: "openai-responses",
-    label: "OpenAI Responses"
-  },
-  {
-    value: "anthropic-messages",
-    label: "Anthropic Messages"
-  },
-  {
-    value: "google-genai",
-    label: "Google Generative AI"
-  }
-];
-function ProviderCredentialFields({ attemptedSave, apiKey, api, baseUrl, modelId, models, displayName, isCustom, onApiKeyChange, onApiChange, onBaseUrlChange, onModelIdChange, onModelsChange, onDisplayNameChange, onTogglePassword, openAiChat, placeholder, showPassword }) {
-  const showApiSelector = isCustom && onApiChange;
-  const showMultiModels = isCustom && onModelsChange;
-  return /* @__PURE__ */ jsxs(FieldGroup, {
-    className: "gap-2",
-    children: [
-      (openAiChat || isCustom) && onDisplayNameChange ? /* @__PURE__ */ jsx(TextCredentialField, {
-        attemptedSave,
-        icon: Tag,
-        label: "Provider name",
-        placeholder: OPENAI_CHAT_NAME_PLACEHOLDER,
-        value: displayName ?? "",
-        onChange: onDisplayNameChange
-      }) : null,
-      showApiSelector ? /* @__PURE__ */ jsx(ApiSelector, {
-        value: api ?? "openai-completions",
-        onChange: onApiChange
-      }) : null,
-      /* @__PURE__ */ jsx(SecretCredentialField, {
-        attemptedSave,
-        label: "API key",
-        placeholder,
-        value: apiKey,
-        showPassword,
-        onChange: onApiKeyChange,
-        onToggleVisibility: onTogglePassword
-      }),
-      openAiChat || isCustom ? /* @__PURE__ */ jsx(TextCredentialField, {
-        attemptedSave,
-        icon: Globe,
-        inputType: "url",
-        label: "Base URL",
-        placeholder: OPENAI_CHAT_BASE_URL_PLACEHOLDER,
-        value: baseUrl,
-        onChange: onBaseUrlChange
-      }) : null,
-      showMultiModels ? /* @__PURE__ */ jsx(TextCredentialField, {
-        attemptedSave,
-        icon: Layers,
-        label: "Model ids",
-        placeholder: CUSTOM_MODELS_PLACEHOLDER,
-        value: models ?? "",
-        onChange: onModelsChange
-      }) : null,
-      openAiChat && !showMultiModels ? /* @__PURE__ */ jsx(TextCredentialField, {
-        attemptedSave,
-        icon: Box,
-        label: "Model name",
-        placeholder: OPENAI_CHAT_MODEL_PLACEHOLDER,
-        value: modelId,
-        onChange: onModelIdChange
-      }) : null
-    ]
-  });
-}
-function ApiSelector({ value, onChange }) {
-  return /* @__PURE__ */ jsxs("div", {
-    className: "flex flex-col gap-1",
-    children: [/* @__PURE__ */ jsx("span", {
-      className: "text-xs font-medium text-muted-foreground",
-      children: "API family"
-    }), /* @__PURE__ */ jsx(Select, {
-      "aria-label": "API family",
-      value,
-      options: CUSTOM_PROVIDER_API_OPTIONS,
-      placeholder: "Select API family",
-      onValueChange: (next) => onChange(next)
-    })]
-  });
-}
-function isOAuthProvider(provider) {
-  return provider.authType === "oauth";
-}
-function supportsOAuth(provider) {
-  return provider.supportsOAuth === true;
+function modelPatternFor(model) {
+  return modelPattern(model.provider, model.modelId);
 }
-var CUSTOM_PROVIDER_PICKER_ROW = {
-  id: "custom",
-  name: "Custom provider",
-  isConfigured: false,
-  envVarName: "CUSTOM_PROVIDER_API_KEY",
-  displayName: "Custom provider"
-};
-function parseCustomProviderModels(raw) {
-  return raw.split(",").map((entry) => entry.trim()).filter((entry) => entry.length > 0);
+function searchableModelText(model) {
+  return [
+    model.name,
+    model.modelId,
+    model.provider,
+    model.id
+  ].join(" ").toLowerCase();
 }
-function useProviderCredentialsController({ onRemoveProvider, onUpdateProvider, providers }) {
-  const [editingProvider, setEditingProvider] = useState2(null);
-  const [editingIsNewOccInstance, setEditingIsNewOccInstance] = useState2(false);
-  const [apiKey, setApiKey] = useState2("");
-  const [baseUrl, setBaseUrl] = useState2("");
-  const [modelId, setModelId] = useState2("");
-  const [models, setModels] = useState2("");
-  const [api, setApi] = useState2("openai-completions");
-  const [displayName, setDisplayName] = useState2("");
-  const [showPassword, setShowPassword] = useState2(false);
-  const [attemptedSave, setAttemptedSave] = useState2(false);
-  const [searchQuery, setSearchQuery] = useState2("");
-  const [addPickerOpen, setAddPickerOpen] = useState2(false);
-  const [addPickerQuery, setAddPickerQuery] = useState2("");
-  const [confirmRemoveProvider, setConfirmRemoveProvider] = useState2(null);
-  const credentialProviders = useMemo2(() => {
-    return [...providers.filter((provider) => provider.id !== CUSTOM_PROVIDER_PICKER_ROW.id), CUSTOM_PROVIDER_PICKER_ROW];
-  }, [providers]);
-  const activeProviders = useMemo2(() => credentialProviders.filter((provider) => provider.isConfigured), [credentialProviders]);
-  const unconfiguredProviders = useMemo2(() => credentialProviders.filter((provider) => !provider.isConfigured || provider.id === "openai-chat-completions" && provider.providerFamily === void 0), [credentialProviders]);
-  const filteredActiveProviders = useMemo2(() => {
-    const query = searchQuery.trim().toLowerCase();
-    if (!query) return activeProviders;
-    return activeProviders.filter((provider) => providerMatchesQuery(provider, query));
-  }, [activeProviders, searchQuery]);
-  const filteredPickerAvailable = useMemo2(() => {
-    const query = addPickerQuery.trim().toLowerCase();
-    return unconfiguredProviders.filter((provider) => providerMatchesQuery(provider, query));
-  }, [addPickerQuery, unconfiguredProviders]);
-  const filteredPickerConfigured = useMemo2(() => {
-    const query = addPickerQuery.trim().toLowerCase();
-    return activeProviders.filter((provider) => providerMatchesQuery(provider, query));
-  }, [activeProviders, addPickerQuery]);
-  const pickerHasResults = filteredPickerAvailable.length > 0 || filteredPickerConfigured.length > 0;
-  const editingUnconfiguredProvider = editingProvider && !activeProviders.some((provider) => provider.id === editingProvider) ? credentialProviders.find((entry) => entry.id === editingProvider) ?? null : null;
-  const resetEditor = () => {
-    setApiKey("");
-    setBaseUrl("");
-    setModelId("");
-    setModels("");
-    setApi("openai-completions");
-    setDisplayName("");
-    setShowPassword(false);
-    setAttemptedSave(false);
-  };
-  const closeEditor = () => {
-    setEditingProvider(null);
-    setEditingIsNewOccInstance(false);
-    resetEditor();
-  };
-  const openEditor = (providerId, opts) => {
-    setAddPickerOpen(false);
-    setAddPickerQuery("");
-    setEditingProvider(providerId);
-    setEditingIsNewOccInstance(opts?.newOccInstance === true);
-    resetEditor();
-    const existing = providers.find((provider) => provider.id === providerId);
-    setBaseUrl(existing?.baseUrl ?? "");
-    setDisplayName(existing?.displayName ?? (isCustomProviderId(providerId) ? existing?.name ?? "" : ""));
-    setApi(existing?.api ?? "openai-completions");
-    setModels((existing?.modelIds ?? []).join(", "));
-    setModelId(existing?.modelIds?.[0] ?? "");
-  };
-  const openAddPicker = () => {
-    closeEditor();
-    setAddPickerQuery("");
-    setAddPickerOpen(true);
-  };
-  const closeAddPicker = () => {
-    setAddPickerOpen(false);
-    setAddPickerQuery("");
-  };
-  const selectProviderFromPicker = (providerId) => {
-    openEditor(providerId, { newOccInstance: isOccProviderId(providerId) });
-  };
-  const handleSave = async (providerId) => {
-    if (!onUpdateProvider) return;
-    setAttemptedSave(true);
-    const isCustomEditor = providerId === "custom" || isCustomProviderId(providerId);
-    const openAiChat = isOccProviderId(providerId);
-    if (isCustomEditor) {
-      const modelList = parseCustomProviderModels(models);
-      if (!apiKey.trim() || !baseUrl.trim() || !displayName.trim()) return;
-      if (modelList.length === 0) return;
-      try {
-        await onUpdateProvider({
-          providerId,
-          apiKey: apiKey.trim(),
-          baseUrl: baseUrl.trim(),
-          displayName: displayName.trim(),
-          api,
-          models: modelList,
-          ...providerId === "custom" ? { createOccInstance: true } : {}
-        });
-        notify.success("Provider credentials applied to your active sessions.");
-        closeEditor();
-        closeAddPicker();
-      } catch (error) {
-        notify.error(error instanceof Error ? error.message : "Failed to update provider");
-      }
-      return;
-    }
-    const isNamedOcc = openAiChat && isNamedOccInstanceId(providerId);
-    const isOccLike = openAiChat && (isNamedOcc || editingIsNewOccInstance);
-    if (!apiKey.trim()) return;
-    if (openAiChat && (!baseUrl.trim() || !modelId.trim())) return;
-    if (isOccLike && !displayName.trim()) return;
-    try {
-      await onUpdateProvider({
-        providerId,
-        apiKey: apiKey.trim(),
-        ...openAiChat ? {
-          baseUrl: baseUrl.trim(),
-          modelId: modelId.trim(),
-          ...isOccLike ? { displayName: displayName.trim() } : {},
-          ...editingIsNewOccInstance ? { createOccInstance: true } : {}
-        } : {}
-      });
-      notify.success("Provider credentials applied to your active sessions.");
-      closeEditor();
-      closeAddPicker();
-    } catch (error) {
-      notify.error(error instanceof Error ? error.message : "Failed to update provider");
+function AddModelsDialog({ configuredProviderIds, discoverableProviderIds, discoveringProviderId, enabledModels, modelOptions, onAddModels, onDiscoverProvider, onOpenChange, open, providerLabel = formatProviderLabel }) {
+  const [filter, setFilter] = useState2("");
+  const [selectedKeys, setSelectedKeys] = useState2(/* @__PURE__ */ new Set());
+  const normalizedFilter = filter.trim().toLowerCase();
+  const candidateModels = useMemo2(() => {
+    return modelOptions.filter((model) => {
+      if (!configuredProviderIds.has(model.provider)) return false;
+      if (isModelEnabled(model, enabledModels)) return false;
+      return !normalizedFilter || searchableModelText(model).includes(normalizedFilter);
+    });
+  }, [
+    configuredProviderIds,
+    enabledModels,
+    modelOptions,
+    normalizedFilter
+  ]);
+  const groupedCandidates = useMemo2(() => {
+    const groups = /* @__PURE__ */ new Map();
+    for (const model of candidateModels) {
+      const existing = groups.get(model.provider);
+      if (existing) existing.push(model);
+      else groups.set(model.provider, [model]);
     }
+    return [...groups.entries()];
+  }, [candidateModels]);
+  const discoverableProviders = useMemo2(() => {
+    const ids = discoverableProviderIds ?? configuredProviderIds;
+    return Array.from(ids).filter((id) => configuredProviderIds.has(id)).sort((a, b) => providerLabel(a).localeCompare(providerLabel(b)));
+  }, [
+    configuredProviderIds,
+    discoverableProviderIds,
+    providerLabel
+  ]);
+  const activeCountByProvider = useMemo2(() => {
+    const counts = /* @__PURE__ */ new Map();
+    for (const model of modelOptions) if (isModelEnabled(model, enabledModels)) counts.set(model.provider, (counts.get(model.provider) ?? 0) + 1);
+    return counts;
+  }, [enabledModels, modelOptions]);
+  const toggleSelected = (model) => {
+    setSelectedKeys((current) => {
+      const next = new Set(current);
+      if (next.has(model.id)) next.delete(model.id);
+      else next.add(model.id);
+      return next;
+    });
   };
-  const handleRemove = async (provider) => {
-    if (!onRemoveProvider) return;
-    try {
-      await onRemoveProvider({ providerId: provider.id });
-      if (editingProvider === provider.id) closeEditor();
-      notify.success(`${provider.name} removed from your configured providers.`);
-      setConfirmRemoveProvider(null);
-    } catch (error) {
-      notify.error(error instanceof Error ? error.message : "Failed to remove provider");
-    }
+  const confirmAdd = () => {
+    const selected = candidateModels.filter((model) => selectedKeys.has(model.id));
+    if (selected.length > 0) onAddModels(selected);
+    onOpenChange(false);
   };
-  return {
-    activeProviders,
-    addPickerOpen,
-    addPickerQuery,
-    api,
-    apiKey,
-    attemptedSave,
-    baseUrl,
-    canSave: useMemo2(() => {
-      if (apiKey.trim().length === 0) return false;
-      if (!editingProvider) return true;
-      if (editingProvider === "custom" || isCustomProviderId(editingProvider)) {
-        if (baseUrl.trim().length === 0) return false;
-        if (parseCustomProviderModels(models).length === 0) return false;
-        return displayName.trim().length > 0;
-      }
-      if (!isOccProviderId(editingProvider)) return true;
-      if (baseUrl.trim().length === 0 || modelId.trim().length === 0) return false;
-      if (isNamedOccInstanceId(editingProvider) || editingIsNewOccInstance) return displayName.trim().length > 0;
-      return true;
-    }, [
-      apiKey,
-      baseUrl,
-      modelId,
-      models,
-      displayName,
-      editingProvider,
-      editingIsNewOccInstance
-    ]),
-    closeAddPicker,
-    closeEditor,
-    confirmRemoveProvider,
-    credentialProviders,
-    displayName,
-    editingIsNewOccInstance,
-    editingProvider,
-    editingUnconfiguredProvider,
-    filteredActiveProviders,
-    filteredPickerAvailable,
-    filteredPickerConfigured,
-    handleRemove,
-    handleSave,
-    modelId,
-    models,
-    openAddPicker,
-    openEditor,
-    pickerHasResults,
-    resetEditor,
-    searchQuery,
-    selectProviderFromPicker,
-    setAddPickerOpen,
-    setAddPickerQuery,
-    setApi,
-    setApiKey,
-    setAttemptedSave,
-    setBaseUrl,
-    setConfirmRemoveProvider,
-    setDisplayName,
-    setEditingIsNewOccInstance,
-    setEditingProvider,
-    setModelId,
-    setModels,
-    setSearchQuery,
-    setShowPassword,
-    showPassword,
-    unconfiguredProviders
-  };
-}
-function providerMatchesQuery(provider, query) {
-  if (!query) return true;
-  const keywords = supportsOAuth(provider) ? isOAuthProvider(provider) ? "oauth sign-in login" : "api key oauth sign-in login" : provider.id === "custom" || isCustomProviderId(provider.id) ? "custom provider endpoint openai anthropic google compatible" : isOccProviderId(provider.id) ? "api key base url model name chat completions" : "";
-  return [
-    provider.name,
-    provider.envVarName,
-    provider.id,
-    keywords
-  ].join(" ").toLowerCase().includes(query);
-}
-function AddProviderPickerPanel({ addPickerQuery, credentialProvidersLength, filteredPickerAvailable, filteredPickerConfigured, pickerHasResults, onClose, onQueryChange, onSelect }) {
-  return /* @__PURE__ */ jsxs("div", {
-    className: "flex flex-col gap-3",
-    children: [
-      /* @__PURE__ */ jsxs("div", {
-        className: "flex items-center gap-2",
-        children: [/* @__PURE__ */ jsx(Button, {
-          type: "button",
-          variant: "ghost",
-          size: "icon-sm",
-          "aria-label": "Back to providers",
-          onClick: onClose,
-          children: /* @__PURE__ */ jsx(ArrowLeft, {})
-        }), /* @__PURE__ */ jsxs("div", {
-          className: "min-w-0 flex-1",
-          children: [/* @__PURE__ */ jsx("p", {
-            className: "text-sm font-medium",
-            children: "Add provider"
-          }), /* @__PURE__ */ jsx("p", {
-            className: "text-xs text-pretty text-muted-foreground",
-            children: "Choose a provider to store encrypted credentials for this account."
+  return /* @__PURE__ */ jsx(Dialog, {
+    open,
+    onOpenChange,
+    children: /* @__PURE__ */ jsxs(DialogContent, {
+      className: "max-w-lg",
+      children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Add models" }), /* @__PURE__ */ jsxs(DialogDescription, { children: [
+          "Pick models discovered from your configured providers. For OpenAI Chat Completions, refresh runs",
+          " ",
+          /* @__PURE__ */ jsxs("span", {
+            className: "font-medium",
+            children: ["GET ", "{baseUrl}/models"]
+          }),
+          "."
+        ] })] }),
+        /* @__PURE__ */ jsx("div", {
+          className: "flex flex-wrap gap-1.5",
+          children: discoverableProviders.map((providerId) => {
+            const discovering = discoveringProviderId === providerId;
+            const activeCount = activeCountByProvider.get(providerId) ?? 0;
+            return /* @__PURE__ */ jsxs(Button, {
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              disabled: discoveringProviderId !== null,
+              onClick: () => {
+                onDiscoverProvider(providerId);
+              },
+              children: [
+                discovering ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : /* @__PURE__ */ jsx(RefreshCw, { "data-icon": "inline-start" }),
+                providerLabel(providerId),
+                activeCount > 0 ? /* @__PURE__ */ jsxs("span", {
+                  className: "tabular-nums text-muted-foreground",
+                  children: [
+                    "\xB7 ",
+                    activeCount,
+                    " active"
+                  ]
+                }) : null
+              ]
+            }, providerId);
+          })
+        }),
+        /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, {
+          align: "inline-start",
+          children: /* @__PURE__ */ jsx(Search, {})
+        }), /* @__PURE__ */ jsx(InputGroupInput, {
+          "aria-label": "Search discovered models",
+          value: filter,
+          onChange: (event) => setFilter(event.target.value),
+          placeholder: "Search discovered models\u2026"
+        })] }),
+        /* @__PURE__ */ jsx("div", {
+          className: "max-h-72 overflow-y-auto",
+          children: groupedCandidates.length === 0 ? /* @__PURE__ */ jsx("p", {
+            className: "py-6 text-center text-xs text-pretty text-muted-foreground",
+            children: candidateModels.length === 0 && !normalizedFilter ? "All discovered models are already in your list, or none are available yet." : "No models match your search."
+          }) : /* @__PURE__ */ jsx("div", {
+            className: "flex flex-col gap-3",
+            children: groupedCandidates.map(([provider, models]) => /* @__PURE__ */ jsxs("div", {
+              className: "flex flex-col gap-1",
+              children: [/* @__PURE__ */ jsxs("div", {
+                className: "px-2 text-[0.6875rem] font-medium tracking-wide text-muted-foreground uppercase",
+                children: [providerLabel(provider), (activeCountByProvider.get(provider) ?? 0) > 0 ? /* @__PURE__ */ jsxs("span", {
+                  className: "ml-1 font-normal normal-case tabular-nums",
+                  children: [
+                    "\xB7 ",
+                    activeCountByProvider.get(provider),
+                    " active"
+                  ]
+                }) : null]
+              }), models.map((model) => {
+                const checked = selectedKeys.has(model.id);
+                return /* @__PURE__ */ jsxs("button", {
+                  type: "button",
+                  className: cn("flex w-full items-center gap-3 rounded-lg px-2 py-2 text-left transition-[background-color,transform] duration-150", "hover:bg-muted/60 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none active:scale-[0.96]", checked && "bg-muted/70"),
+                  "aria-pressed": checked,
+                  onClick: () => toggleSelected(model),
+                  children: [
+                    /* @__PURE__ */ jsx("div", {
+                      className: "flex size-8 shrink-0 items-center justify-center rounded-[4px] border border-border/40 bg-background/60",
+                      children: /* @__PURE__ */ jsx(ProviderBrandIcon, {
+                        provider: model.provider,
+                        className: "text-foreground/70"
+                      })
+                    }),
+                    /* @__PURE__ */ jsxs("div", {
+                      className: "min-w-0 flex-1",
+                      children: [/* @__PURE__ */ jsx("div", {
+                        className: "truncate text-sm font-medium",
+                        children: model.name
+                      }), /* @__PURE__ */ jsx("div", {
+                        className: "truncate text-xs text-muted-foreground",
+                        children: model.modelId
+                      })]
+                    }),
+                    /* @__PURE__ */ jsx("span", {
+                      className: cn("size-4 rounded border border-border/60", checked && "border-foreground bg-foreground"),
+                      "aria-hidden": true
+                    })
+                  ]
+                }, model.id);
+              })]
+            }, provider))
+          })
+        }),
+        /* @__PURE__ */ jsxs("div", {
+          className: "flex items-center justify-end gap-1.5",
+          children: [/* @__PURE__ */ jsx(Button, {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            onClick: () => onOpenChange(false),
+            children: "Cancel"
+          }), /* @__PURE__ */ jsxs(Button, {
+            type: "button",
+            size: "sm",
+            disabled: selectedKeys.size === 0,
+            onClick: confirmAdd,
+            children: ["Add ", selectedKeys.size > 0 ? /* @__PURE__ */ jsxs("span", {
+              className: "tabular-nums",
+              children: [
+                "(",
+                selectedKeys.size,
+                ")"
+              ]
+            }) : null]
           })]
-        })]
-      }),
-      /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, {
-        align: "inline-start",
-        children: /* @__PURE__ */ jsx(Search, {})
-      }), /* @__PURE__ */ jsx(InputGroupInput, {
-        type: "text",
-        placeholder: "Search providers\u2026",
-        value: addPickerQuery,
-        onChange: (event) => onQueryChange(event.target.value),
-        "aria-label": "Search providers to add"
-      })] }),
-      /* @__PURE__ */ jsx("div", {
-        className: "max-h-[min(24rem,50vh)] overflow-y-auto",
-        children: !pickerHasResults ? /* @__PURE__ */ jsx("p", {
-          className: "py-6 text-center text-xs text-pretty text-muted-foreground",
-          children: credentialProvidersLength === 0 ? "No providers available." : "No matching providers found."
-        }) : /* @__PURE__ */ jsxs("div", {
-          className: "flex flex-col gap-3",
-          children: [filteredPickerAvailable.length > 0 ? /* @__PURE__ */ jsx("div", {
-            className: "flex flex-col gap-1",
-            children: filteredPickerAvailable.map((provider) => /* @__PURE__ */ jsx(ProviderPickerRow, {
-              provider,
-              configured: false,
-              onSelect: () => onSelect(provider.id)
-            }, provider.id))
-          }) : null, filteredPickerConfigured.length > 0 ? /* @__PURE__ */ jsxs("div", {
-            className: "flex flex-col gap-1",
-            children: [filteredPickerAvailable.length > 0 ? /* @__PURE__ */ jsx("p", {
-              className: "px-2 pt-1 text-[0.6875rem] font-medium tracking-wide text-muted-foreground uppercase",
-              children: "Already configured"
-            }) : null, filteredPickerConfigured.map((provider) => /* @__PURE__ */ jsx(ProviderPickerRow, {
-              provider,
-              configured: true,
-              onSelect: () => onSelect(provider.id)
-            }, provider.id))]
-          }) : null]
         })
-      })
-    ]
+      ]
+    })
   });
 }
-function AddProviderOAuthPanel({ onBack, onConfigured, onOAuthLogin, provider }) {
-  return /* @__PURE__ */ jsxs("div", {
-    className: "flex flex-col gap-3",
-    children: [/* @__PURE__ */ jsxs("div", {
-      className: "flex items-center gap-2",
-      children: [/* @__PURE__ */ jsx(Button, {
-        type: "button",
-        variant: "ghost",
-        size: "icon-sm",
-        "aria-label": "Back to provider list",
-        onClick: onBack,
-        children: /* @__PURE__ */ jsx(ArrowLeft, {})
-      }), /* @__PURE__ */ jsxs("div", {
-        className: "min-w-0 flex-1",
-        children: [/* @__PURE__ */ jsxs("p", {
-          className: "text-sm font-medium",
-          children: ["Configure ", provider.name]
-        }), /* @__PURE__ */ jsx("p", {
-          className: "text-xs text-pretty text-muted-foreground",
-          children: "OAuth sign-in. Credentials are stored in auth.json for this account."
-        })]
-      })]
-    }), /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
-      provider,
-      onConfigured,
-      onOAuthLogin
-    }, provider.id)]
-  });
-}
-function AddProviderEditorPanel({ provider, api, apiKey, baseUrl, modelId, models, displayName, showPassword, attemptedSave, isPending, canSave, onApiKeyChange, onApiChange, onBaseUrlChange, onModelIdChange, onModelsChange, onDisplayNameChange, onTogglePassword, onBack, onCancel, onConfigured, onOAuthLogin, onSave }) {
-  const isCustomTemplate = provider.id === "custom" || isCustomProviderId(provider.id);
-  const meta = PROVIDER_METADATA[provider.id] ?? (isCustomTemplate ? PROVIDER_METADATA["custom"] : {
-    placeholder: "Enter credentials\u2026",
-    help: "Stored securely in your local environment overrides."
-  });
-  const openAiChat = isOccProviderId(provider.id) && !isCustomTemplate;
-  const oauthAvailable = supportsOAuth(provider);
-  return /* @__PURE__ */ jsxs("div", {
-    className: "flex flex-col gap-3",
+function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelFilter, modelOptions, onAddModels, onDiscoverProvider, onModelFilterChange, onRemoveModel, onSetDefaultModel, onRevert, onSave, providers, saving, settingsLoading }) {
+  const [addOpen, setAddOpen] = useState2(false);
+  const disabled2 = !draft || settingsLoading;
+  const normalizedFilter = modelFilter.trim().toLowerCase();
+  const configuredProviderIds = useMemo2(() => {
+    const ids = /* @__PURE__ */ new Set();
+    for (const provider of providers) if (provider.isConfigured) ids.add(provider.id);
+    for (const model of modelOptions) if (isModelEnabled(model, draft?.enabledModels)) ids.add(model.provider);
+    return ids;
+  }, [
+    draft?.enabledModels,
+    modelOptions,
+    providers
+  ]);
+  const discoverableProviderIds = useMemo2(() => {
+    const ids = /* @__PURE__ */ new Set();
+    for (const provider of providers) if (provider.discoverable === true && configuredProviderIds.has(provider.id)) ids.add(provider.id);
+    return ids;
+  }, [configuredProviderIds, providers]);
+  const isDefaultModel = useMemo2(() => {
+    return (model) => !!draft?.defaultProvider && !!draft?.defaultModel && model.provider === draft.defaultProvider && model.modelId === draft.defaultModel;
+  }, [draft?.defaultModel, draft?.defaultProvider]);
+  const providerLabel = useMemo2(() => {
+    const labels = /* @__PURE__ */ new Map();
+    for (const provider of providers) if (provider.displayName || provider.name) labels.set(provider.id, provider.displayName ?? provider.name ?? provider.id);
+    return (providerId) => labels.get(providerId) ?? formatProviderLabel(providerId);
+  }, [providers]);
+  const listedModels = useMemo2(() => {
+    return modelOptions.filter((model) => {
+      if (!isModelEnabled(model, draft?.enabledModels)) return false;
+      if (!normalizedFilter) return true;
+      return [
+        model.name,
+        model.modelId,
+        model.provider,
+        model.id
+      ].join(" ").toLowerCase().includes(normalizedFilter);
+    });
+  }, [
+    draft?.enabledModels,
+    modelOptions,
+    normalizedFilter
+  ]);
+  const groupedListed = useMemo2(() => {
+    const groups = /* @__PURE__ */ new Map();
+    for (const model of listedModels) {
+      const existing = groups.get(model.provider);
+      if (existing) existing.push(model);
+      else groups.set(model.provider, [model]);
+    }
+    return [...groups.entries()];
+  }, [listedModels]);
+  const emptyMessage = (() => {
+    if (modelOptions.length === 0) return "No models discovered yet. Configure a provider, then add models.";
+    if (listedModels.length === 0 && !normalizedFilter) return "Add models from your configured providers to make them available in chat.";
+    if (listedModels.length === 0) return "No models match your search.";
+    return null;
+  })();
+  const openAddDialog = () => {
+    setAddOpen(true);
+  };
+  return /* @__PURE__ */ jsxs(SettingsPane, {
+    title: "LLM Models",
+    description: /* @__PURE__ */ jsxs(Fragment$1, { children: [
+      "Models available in chat. Discover from configured providers, add the ones you want, and remove any you do not need \u2014 changes save automatically. ",
+      /* @__PURE__ */ jsx("span", {
+        className: "tabular-nums",
+        children: listedModels.length
+      }),
+      " in list",
+      modelOptions.length > 0 ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+        " ",
+        "\xB7 ",
+        /* @__PURE__ */ jsx("span", {
+          className: "tabular-nums",
+          children: modelOptions.length
+        }),
+        " discovered"
+      ] }) : null,
+      "."
+    ] }),
+    actions: /* @__PURE__ */ jsx(SettingsCommitActions, {
+      dirty: modelDirty,
+      disabled: disabled2,
+      onRevert,
+      onSave,
+      saving
+    }),
     children: [
       /* @__PURE__ */ jsxs("div", {
         className: "flex items-center gap-2",
-        children: [/* @__PURE__ */ jsx(Button, {
-          type: "button",
-          variant: "ghost",
-          size: "icon-sm",
-          "aria-label": "Back to provider list",
-          onClick: onBack,
-          children: /* @__PURE__ */ jsx(ArrowLeft, {})
-        }), /* @__PURE__ */ jsxs("div", {
-          className: "min-w-0 flex-1",
-          children: [/* @__PURE__ */ jsxs("p", {
-            className: "text-sm font-medium",
-            children: ["Configure ", provider.name]
-          }), /* @__PURE__ */ jsx("p", {
-            className: "text-xs text-pretty text-muted-foreground",
-            children: isCustomTemplate ? "Name this custom provider, pick its API family, then enter its API key, https base URL, and model ids." : openAiChat ? "Name this OpenAI-compatible provider, then enter its API key, base URL, and model name." : `Stored as ${provider.envVarName} for this account.`
+        children: [/* @__PURE__ */ jsxs(InputGroup, {
+          className: "flex-1",
+          children: [/* @__PURE__ */ jsx(InputGroupAddon, {
+            align: "inline-start",
+            children: /* @__PURE__ */ jsx(Search, {})
+          }), /* @__PURE__ */ jsx(InputGroupInput, {
+            "aria-label": "Search listed models",
+            value: modelFilter,
+            onChange: (event) => onModelFilterChange(event.target.value),
+            placeholder: "Search listed models\u2026",
+            disabled: disabled2 || listedModels.length === 0
           })]
-        })]
-      }),
-      /* @__PURE__ */ jsx(ProviderCredentialFields, {
-        attemptedSave,
-        api,
-        apiKey,
-        baseUrl,
-        modelId,
-        models,
-        displayName,
-        isCustom: isCustomTemplate,
-        openAiChat,
-        placeholder: meta.placeholder,
-        showPassword,
-        onApiKeyChange,
-        onApiChange,
-        onBaseUrlChange,
-        onModelIdChange,
-        onModelsChange,
-        onDisplayNameChange,
-        onTogglePassword
-      }),
-      /* @__PURE__ */ jsxs(Alert, {
-        className: "px-3 py-2",
-        children: [/* @__PURE__ */ jsx(Info, {}), /* @__PURE__ */ jsx(AlertDescription, {
-          className: "text-xs text-pretty",
-          children: meta.help
-        })]
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "flex items-center justify-end gap-1.5",
-        children: [/* @__PURE__ */ jsx(Button, {
-          type: "button",
-          variant: "ghost",
-          size: "sm",
-          onClick: onCancel,
-          children: "Cancel"
         }), /* @__PURE__ */ jsxs(Button, {
           type: "button",
+          variant: "outline",
           size: "sm",
-          disabled: isPending || !canSave,
-          onClick: onSave,
-          children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
+          disabled: disabled2,
+          onClick: openAddDialog,
+          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
         })]
       }),
-      oauthAvailable ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
-        provider,
-        onConfigured: onConfigured ?? onCancel,
-        onOAuthLogin
-      }, `${provider.id}-oauth`) : null
+      /* @__PURE__ */ jsx("div", {
+        className: "flex flex-col gap-3",
+        "data-testid": "runtime-models-list",
+        children: emptyMessage ? /* @__PURE__ */ jsxs("div", {
+          className: "flex flex-col items-center gap-3 py-8",
+          children: [/* @__PURE__ */ jsx("p", {
+            className: "px-1 text-center text-xs text-pretty text-muted-foreground",
+            children: emptyMessage
+          }), !normalizedFilter ? /* @__PURE__ */ jsxs(Button, {
+            type: "button",
+            variant: "outline",
+            size: "sm",
+            disabled: disabled2,
+            onClick: openAddDialog,
+            children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
+          }) : null]
+        }) : groupedListed.map(([provider, models]) => /* @__PURE__ */ jsxs("div", {
+          className: "flex flex-col gap-1.5",
+          children: [/* @__PURE__ */ jsx("div", {
+            className: "px-1 text-xs font-medium text-muted-foreground",
+            children: providerLabel(provider)
+          }), models.map((model) => /* @__PURE__ */ jsx(ItemRow, {
+            icon: /* @__PURE__ */ jsx(ProviderBrandIcon, { provider: model.provider }),
+            title: model.name,
+            subtitle: `${providerLabel(model.provider)} \xB7 ${model.modelId}`,
+            trailing: /* @__PURE__ */ jsxs("div", {
+              className: "flex items-center",
+              children: [isDefaultModel(model) ? /* @__PURE__ */ jsx("span", {
+                className: "px-2 text-xs font-medium text-muted-foreground",
+                children: "Default"
+              }) : onSetDefaultModel ? /* @__PURE__ */ jsxs(Button, {
+                type: "button",
+                variant: "ghost",
+                size: "sm",
+                className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 active:scale-[0.96]"),
+                disabled: disabled2,
+                "aria-label": `Set ${model.name} as default`,
+                onClick: () => onSetDefaultModel(model),
+                children: [/* @__PURE__ */ jsx(Star, { "data-icon": "inline-start" }), "Set default"]
+              }) : null, /* @__PURE__ */ jsxs(Button, {
+                type: "button",
+                variant: "ghost",
+                size: "sm",
+                className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 hover:text-destructive active:scale-[0.96]"),
+                disabled: disabled2,
+                "aria-label": `Remove ${model.name}`,
+                onClick: () => onRemoveModel(model),
+                children: [/* @__PURE__ */ jsx(Trash2, { "data-icon": "inline-start" }), "Remove"]
+              })]
+            })
+          }, model.id))]
+        }, provider))
+      }),
+      /* @__PURE__ */ jsx(AddModelsDialog, {
+        open: addOpen,
+        configuredProviderIds,
+        discoverableProviderIds,
+        discoveringProviderId,
+        enabledModels: draft?.enabledModels,
+        modelOptions,
+        onAddModels,
+        onDiscoverProvider,
+        onOpenChange: setAddOpen,
+        providerLabel
+      })
     ]
   });
 }
-function RemoveProviderConfirmDialog({ confirmRemoveProvider, isPending, onClose, onConfirm }) {
-  return /* @__PURE__ */ jsx(AlertDialog, {
-    open: confirmRemoveProvider !== null,
-    onOpenChange: (open) => {
-      if (!open) onClose();
-    },
-    children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs("div", {
-      className: "flex flex-col gap-2",
-      children: [/* @__PURE__ */ jsxs(AlertDialogTitle, { children: [
-        "Remove ",
-        confirmRemoveProvider?.name ?? "provider",
-        "?"
-      ] }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: "This clears stored credentials for this provider from your workspace settings. Active sessions will stop using it immediately." })]
-    }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, {
-      disabled: isPending,
-      children: "Cancel"
-    }), /* @__PURE__ */ jsxs(AlertDialogAction, {
-      disabled: isPending || !confirmRemoveProvider,
-      onClick: () => {
-        if (confirmRemoveProvider) onConfirm(confirmRemoveProvider);
-      },
-      children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Remove provider"]
-    })] })] })
-  });
-}
-function ProviderPickerRow({ configured, onSelect, provider }) {
-  const openAiChat = isOccProviderId(provider.id);
-  const isCustomTemplate = provider.id === "custom" || isCustomProviderId(provider.id);
-  const oauthOnly = isOAuthProvider(provider);
-  const oauthAvailable = supportsOAuth(provider);
-  return /* @__PURE__ */ jsxs("button", {
-    type: "button",
-    className: cn("flex w-full items-center gap-3 rounded-lg px-2 py-2 text-left transition-[background-color,transform] duration-150", "hover:bg-muted/60 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none active:scale-[0.96]"),
-    onClick: onSelect,
-    children: [/* @__PURE__ */ jsx("div", {
-      className: "flex size-8 shrink-0 items-center justify-center rounded-[4px] border border-border/40 bg-background/60",
-      children: /* @__PURE__ */ jsx(ProviderBrandIcon, {
-        provider: isCustomTemplate ? "custom" : provider.id,
-        api: provider.api,
-        className: "text-foreground/70"
+var THEME_OPTIONS = [
+  {
+    value: "system",
+    label: "System",
+    icon: Monitor
+  },
+  {
+    value: "light",
+    label: "Light",
+    icon: Sun
+  },
+  {
+    value: "dark",
+    label: "Dark",
+    icon: Moon
+  }
+];
+function PersonalizationSection({ onThemePreferenceChange, themePreference }) {
+  return /* @__PURE__ */ jsxs(Field, {
+    orientation: "horizontal",
+    className: "items-center justify-between gap-6 rounded-xl border p-4",
+    children: [/* @__PURE__ */ jsxs("div", {
+      className: "min-w-0",
+      children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Theme" }), /* @__PURE__ */ jsx(FieldDescription, { children: "Match the system theme or pick light or dark." })]
+    }), /* @__PURE__ */ jsx("div", {
+      className: "shrink-0",
+      children: /* @__PURE__ */ jsx(Select, {
+        "aria-label": "Theme",
+        className: "w-[160px]",
+        onValueChange: (value) => onThemePreferenceChange(value),
+        options: [...THEME_OPTIONS],
+        value: themePreference
       })
-    }), /* @__PURE__ */ jsxs("div", {
-      className: "min-w-0 flex-1",
-      children: [/* @__PURE__ */ jsx("div", {
-        className: "truncate text-sm font-medium",
-        children: provider.name
-      }), /* @__PURE__ */ jsxs("div", {
-        className: "truncate text-xs text-muted-foreground",
-        children: [oauthOnly ? "OAuth sign-in" : oauthAvailable ? "API key or OAuth" : isCustomTemplate ? "API family + key + https base URL + models" : openAiChat ? "API key + base URL + model name" : provider.envVarName, configured ? " \xB7 Update" : ""]
-      })]
     })]
   });
 }
-function ActiveProviderList({ providers, editingProvider, form, operation, actions, onEdit, onCancelEdit, onSave, onRemove, onOAuthLogin, onConfigured }) {
-  const { api, apiKey, baseUrl, modelId, models, displayName, showPassword, attemptedSave, canSave } = form;
-  const { isPending, canRemove } = operation;
-  const { onApiKeyChange, onApiChange, onBaseUrlChange, onModelIdChange, onModelsChange, onDisplayNameChange, onTogglePassword } = actions;
-  return /* @__PURE__ */ jsx("div", {
-    className: "flex flex-col gap-1.5",
-    children: providers.map((provider) => {
-      const isEditing = editingProvider === provider.id;
-      const isCustom = isCustomProviderId(provider.id);
-      const meta = PROVIDER_METADATA[provider.id] ?? PROVIDER_METADATA[isCustom ? "custom" : "openai-chat-completions"];
-      const openAiChat = isOccProviderId(provider.id);
-      const oauthOnly = isOAuthProvider(provider);
-      const oauthAvailable = supportsOAuth(provider);
-      return /* @__PURE__ */ jsxs("div", {
-        className: "flex flex-col",
-        children: [/* @__PURE__ */ jsx(ItemRow, {
-          interactive: false,
-          icon: /* @__PURE__ */ jsx(ProviderBrandIcon, {
-            provider: provider.id,
-            api: provider.api,
-            className: "text-foreground/80"
-          }),
-          title: provider.name,
-          subtitle: oauthOnly ? "OAuth sign-in" : oauthAvailable ? "API key or OAuth" : isCustom ? "Custom provider \xB7 API key + base URL + models" : openAiChat ? "OpenAI-compatible \xB7 API key + base URL + model name" : provider.envVarName,
-          trailing: /* @__PURE__ */ jsxs("div", {
-            className: "flex items-center gap-0.5",
-            children: [/* @__PURE__ */ jsxs(Button, {
-              type: "button",
-              variant: "ghost",
-              size: "sm",
-              className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 hover:text-destructive active:scale-[0.96]"),
-              disabled: isPending || !canRemove,
-              "aria-label": `Remove ${provider.name}`,
-              onClick: () => onRemove(provider),
-              children: [/* @__PURE__ */ jsx(Trash2, { "data-icon": "inline-start" }), "Remove"]
-            }), /* @__PURE__ */ jsxs(Button, {
-              type: "button",
-              variant: "ghost",
-              size: "sm",
-              className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs transition-[background-color,transform] duration-150 active:scale-[0.96]"),
-              disabled: isPending,
-              onClick: () => {
-                if (isEditing) {
-                  onCancelEdit();
-                  return;
-                }
-                onEdit(provider.id);
-              },
-              children: [!isEditing ? /* @__PURE__ */ jsx(Pencil, { "data-icon": "inline-start" }) : null, isEditing ? "Cancel" : "Update"]
-            })]
-          })
-        }), isEditing ? /* @__PURE__ */ jsx(RowSurface, {
-          tone: "inset",
-          padding: "md",
-          className: "flex flex-col gap-2 border-t border-border/30",
-          children: oauthOnly ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
-            provider,
-            onConfigured,
-            onOAuthLogin
-          }, provider.id) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
-            /* @__PURE__ */ jsx(ProviderCredentialFields, {
-              attemptedSave,
-              api: provider.api ?? api,
-              apiKey,
-              baseUrl,
-              modelId,
-              models,
-              displayName,
-              isCustom,
-              openAiChat,
-              placeholder: meta.placeholder,
-              showPassword,
-              onApiKeyChange,
-              onApiChange,
-              onBaseUrlChange,
-              onModelIdChange,
-              onModelsChange,
-              onDisplayNameChange: isCustom || provider.providerFamily !== void 0 ? onDisplayNameChange : void 0,
-              onTogglePassword
-            }),
-            /* @__PURE__ */ jsxs(Alert, {
-              className: "px-3 py-2",
-              children: [/* @__PURE__ */ jsx(Info, {}), /* @__PURE__ */ jsx(AlertDescription, {
-                className: "text-xs text-pretty",
-                children: meta.help
-              })]
-            }),
-            /* @__PURE__ */ jsx("div", {
-              className: "flex items-center justify-end",
-              children: /* @__PURE__ */ jsxs(Button, {
-                type: "button",
-                size: "sm",
-                disabled: isPending || !canSave,
-                onClick: () => onSave(provider.id),
-                children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
-              })
-            }),
-            oauthAvailable ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
-              provider,
-              onConfigured,
-              onOAuthLogin
-            }, `${provider.id}-oauth`) : null
-          ] })
-        }) : null]
-      }, provider.id);
-    })
+function isFieldInvalid(value, attemptedSave, required = true) {
+  return attemptedSave && required && value.trim().length === 0;
+}
+function SecretCredentialField({ attemptedSave, label, onChange, onToggleVisibility, placeholder, required = true, showPassword, value }) {
+  const controlId = useId();
+  const invalid = isFieldInvalid(value, attemptedSave, required);
+  return /* @__PURE__ */ jsxs(Field, {
+    "data-invalid": invalid || void 0,
+    children: [/* @__PURE__ */ jsx(FieldLabel, {
+      htmlFor: controlId,
+      children: label
+    }), /* @__PURE__ */ jsxs(InputGroup, { children: [
+      /* @__PURE__ */ jsx(InputGroupAddon, {
+        align: "inline-start",
+        children: /* @__PURE__ */ jsx(Lock, {})
+      }),
+      /* @__PURE__ */ jsx(InputGroupInput, {
+        id: controlId,
+        type: showPassword ? "text" : "password",
+        placeholder,
+        value,
+        onChange: (event) => onChange(event.target.value),
+        "aria-label": label,
+        "aria-invalid": invalid || void 0
+      }),
+      /* @__PURE__ */ jsx(InputGroupAddon, {
+        align: "inline-end",
+        children: /* @__PURE__ */ jsx(InputGroupButton, {
+          size: "icon-xs",
+          className: cn(HIT_AREA_EXPAND_CLASS, "transition-[background-color,transform] duration-150 active:scale-[0.96]"),
+          "aria-label": showPassword ? "Hide value" : "Show value",
+          onClick: onToggleVisibility,
+          children: showPassword ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {})
+        })
+      })
+    ] })]
   });
 }
-function ProviderCredentialsSection({ isLoading, isPending, onOAuthLogin, onRemoveProvider, onUpdateProvider, providers }) {
-  const { activeProviders, addPickerOpen, addPickerQuery, api, apiKey, attemptedSave, baseUrl, canSave, closeAddPicker, closeEditor, confirmRemoveProvider, credentialProviders, displayName, editingProvider, editingUnconfiguredProvider, filteredActiveProviders, filteredPickerAvailable, filteredPickerConfigured, handleRemove, handleSave, modelId, models, openAddPicker, openEditor, pickerHasResults, searchQuery, selectProviderFromPicker, setAddPickerQuery, setApi, setApiKey, setBaseUrl, setConfirmRemoveProvider, setDisplayName, setModelId, setModels, setSearchQuery, setShowPassword, showPassword } = useProviderCredentialsController({
-    onRemoveProvider,
-    onUpdateProvider,
-    providers
-  });
-  const form = {
-    api,
-    apiKey,
-    baseUrl,
-    modelId,
-    models,
-    displayName,
-    showPassword,
-    attemptedSave,
-    canSave
-  };
-  const operation = {
-    isPending,
-    canRemove: Boolean(onRemoveProvider)
-  };
-  const actions = {
-    onApiKeyChange: setApiKey,
-    onApiChange: setApi,
-    onBaseUrlChange: setBaseUrl,
-    onModelIdChange: setModelId,
-    onModelsChange: setModels,
-    onDisplayNameChange: setDisplayName,
-    onTogglePassword: () => setShowPassword((current) => !current)
-  };
-  return /* @__PURE__ */ jsxs(SettingsPane, {
-    title: "Providers",
-    description: "Locally, API keys are stored in `.env.local`. When deployed, they are stored encrypted in your account.",
-    children: [addPickerOpen ? /* @__PURE__ */ jsx(AddProviderPickerPanel, {
-      addPickerQuery,
-      credentialProvidersLength: credentialProviders.length,
-      filteredPickerAvailable,
-      filteredPickerConfigured,
-      pickerHasResults,
-      onClose: closeAddPicker,
-      onQueryChange: setAddPickerQuery,
-      onSelect: selectProviderFromPicker
-    }) : editingUnconfiguredProvider && isOAuthProvider(editingUnconfiguredProvider) ? /* @__PURE__ */ jsx(AddProviderOAuthPanel, {
-      provider: editingUnconfiguredProvider,
-      onBack: openAddPicker,
-      onConfigured: closeEditor,
-      onOAuthLogin
-    }, editingUnconfiguredProvider.id) : editingUnconfiguredProvider ? /* @__PURE__ */ jsx(AddProviderEditorPanel, {
-      provider: editingUnconfiguredProvider,
-      api,
-      apiKey,
-      baseUrl,
-      modelId,
-      models,
-      displayName,
-      showPassword,
-      attemptedSave,
-      isPending,
-      canSave,
-      onApiKeyChange: setApiKey,
-      onApiChange: setApi,
-      onBaseUrlChange: setBaseUrl,
-      onModelIdChange: setModelId,
-      onModelsChange: setModels,
-      onDisplayNameChange: setDisplayName,
-      onTogglePassword: () => setShowPassword((current) => !current),
-      onBack: openAddPicker,
-      onCancel: closeEditor,
-      onConfigured: closeEditor,
-      onOAuthLogin,
-      onSave: () => {
-        if (editingProvider) handleSave(editingProvider);
-      }
-    }) : /* @__PURE__ */ jsxs("div", {
-      className: "flex flex-col gap-3",
-      children: [/* @__PURE__ */ jsxs("div", {
-        className: "flex items-center gap-2",
-        children: [/* @__PURE__ */ jsxs(InputGroup, {
-          className: "flex-1",
-          children: [/* @__PURE__ */ jsx(InputGroupAddon, {
-            align: "inline-start",
-            children: /* @__PURE__ */ jsx(Search, {})
-          }), /* @__PURE__ */ jsx(InputGroupInput, {
-            type: "text",
-            placeholder: "Search credentials\u2026",
-            value: searchQuery,
-            onChange: (event) => setSearchQuery(event.target.value),
-            "aria-label": "Search credentials",
-            disabled: isLoading || activeProviders.length === 0
-          })]
-        }), /* @__PURE__ */ jsxs(Button, {
-          type: "button",
-          variant: "outline",
-          size: "sm",
-          disabled: isLoading || credentialProviders.length === 0,
-          onClick: openAddPicker,
-          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add provider"]
-        })]
-      }), isLoading ? /* @__PURE__ */ jsxs("div", {
-        className: "flex items-center justify-center gap-2 py-6 text-xs text-muted-foreground",
-        children: [/* @__PURE__ */ jsx(Spinner, { className: "size-3" }), /* @__PURE__ */ jsx("span", { children: "Loading\u2026" })]
-      }) : activeProviders.length === 0 ? /* @__PURE__ */ jsxs("div", {
-        className: "flex flex-col items-center gap-3 py-8",
-        children: [/* @__PURE__ */ jsx("p", {
-          className: "text-center text-xs text-pretty text-muted-foreground",
-          children: "No providers configured"
-        }), /* @__PURE__ */ jsxs(Button, {
-          type: "button",
-          variant: "outline",
-          size: "sm",
-          disabled: credentialProviders.length === 0,
-          onClick: openAddPicker,
-          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add provider"]
-        })]
-      }) : filteredActiveProviders.length === 0 ? /* @__PURE__ */ jsx("p", {
-        className: "py-6 text-center text-xs text-pretty text-muted-foreground",
-        children: "No matching providers found."
-      }) : /* @__PURE__ */ jsx(ActiveProviderList, {
-        providers: filteredActiveProviders,
-        editingProvider,
-        form,
-        operation,
-        actions,
-        onEdit: openEditor,
-        onCancelEdit: closeEditor,
-        onSave: (providerId) => void handleSave(providerId),
-        onRemove: setConfirmRemoveProvider,
-        onOAuthLogin,
-        onConfigured: closeEditor
-      })]
-    }), /* @__PURE__ */ jsx(RemoveProviderConfirmDialog, {
-      confirmRemoveProvider,
-      isPending,
-      onClose: () => setConfirmRemoveProvider(null),
-      onConfirm: (provider) => {
-        handleRemove(provider);
-      }
-    })]
+function TextCredentialField({ attemptedSave, icon: Icon, inputType = "text", label, onChange, placeholder, required = true, value }) {
+  const controlId = useId();
+  const invalid = isFieldInvalid(value, attemptedSave, required);
+  return /* @__PURE__ */ jsxs(Field, {
+    "data-invalid": invalid || void 0,
+    children: [/* @__PURE__ */ jsx(FieldLabel, {
+      htmlFor: controlId,
+      children: label
+    }), /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, {
+      align: "inline-start",
+      children: /* @__PURE__ */ jsx(Icon, {})
+    }), /* @__PURE__ */ jsx(InputGroupInput, {
+      id: controlId,
+      type: inputType,
+      placeholder,
+      value,
+      onChange: (event) => onChange(event.target.value),
+      "aria-label": label,
+      "aria-invalid": invalid || void 0
+    })] })]
   });
 }
-function customModelKey(provider, model) {
-  return `${provider}/${model}`;
+var OPENAI_CHAT_BASE_URL_PLACEHOLDER = "https://opencode.ai/zen/v1";
+var OPENAI_CHAT_MODEL_PLACEHOLDER = "qwen35-122b-a10b";
+var OPENAI_CHAT_NAME_PLACEHOLDER = "e.g. OpenCode Zen, Nebius, Groq\u2026";
+var CUSTOM_MODELS_PLACEHOLDER = "model-a, model-b (comma-separated)";
+var CUSTOM_PROVIDER_API_OPTIONS = [
+  {
+    value: "openai-completions",
+    label: "OpenAI Chat Completions"
+  },
+  {
+    value: "openai-responses",
+    label: "OpenAI Responses"
+  },
+  {
+    value: "anthropic-messages",
+    label: "Anthropic Messages"
+  },
+  {
+    value: "google-genai",
+    label: "Google Generative AI"
+  }
+];
+function ProviderCredentialFields({ attemptedSave, apiKey, api, baseUrl, modelId, models, displayName, isCustom, onApiKeyChange, onApiChange, onBaseUrlChange, onModelIdChange, onModelsChange, onDisplayNameChange, onTogglePassword, openAiChat, placeholder, showPassword }) {
+  const showApiSelector = isCustom && onApiChange;
+  const showMultiModels = isCustom && onModelsChange;
+  return /* @__PURE__ */ jsxs(FieldGroup, {
+    className: "gap-2",
+    children: [
+      (openAiChat || isCustom) && onDisplayNameChange ? /* @__PURE__ */ jsx(TextCredentialField, {
+        attemptedSave,
+        icon: Tag,
+        label: "Provider name",
+        placeholder: OPENAI_CHAT_NAME_PLACEHOLDER,
+        value: displayName ?? "",
+        onChange: onDisplayNameChange
+      }) : null,
+      showApiSelector ? /* @__PURE__ */ jsx(ApiSelector, {
+        value: api ?? "openai-completions",
+        onChange: onApiChange
+      }) : null,
+      /* @__PURE__ */ jsx(SecretCredentialField, {
+        attemptedSave,
+        label: "API key",
+        placeholder,
+        value: apiKey,
+        showPassword,
+        onChange: onApiKeyChange,
+        onToggleVisibility: onTogglePassword
+      }),
+      openAiChat || isCustom ? /* @__PURE__ */ jsx(TextCredentialField, {
+        attemptedSave,
+        icon: Globe,
+        inputType: "url",
+        label: "Base URL",
+        placeholder: OPENAI_CHAT_BASE_URL_PLACEHOLDER,
+        value: baseUrl,
+        onChange: onBaseUrlChange
+      }) : null,
+      showMultiModels ? /* @__PURE__ */ jsx(TextCredentialField, {
+        attemptedSave,
+        icon: Layers,
+        label: "Model ids",
+        placeholder: CUSTOM_MODELS_PLACEHOLDER,
+        value: models ?? "",
+        onChange: onModelsChange
+      }) : null,
+      openAiChat && !showMultiModels ? /* @__PURE__ */ jsx(TextCredentialField, {
+        attemptedSave,
+        icon: Box,
+        label: "Model name",
+        placeholder: OPENAI_CHAT_MODEL_PLACEHOLDER,
+        value: modelId,
+        onChange: onModelIdChange
+      }) : null
+    ]
+  });
 }
-function isModelEnabled(model, patterns) {
-  return isModelPatternEnabled({
-    id: model.id,
-    name: model.name,
-    provider: model.provider,
-    modelId: model.modelId
-  }, patterns);
+function ApiSelector({ value, onChange }) {
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-1",
+    children: [/* @__PURE__ */ jsx("span", {
+      className: "text-xs font-medium text-muted-foreground",
+      children: "API family"
+    }), /* @__PURE__ */ jsx(Select, {
+      "aria-label": "API family",
+      value,
+      options: CUSTOM_PROVIDER_API_OPTIONS,
+      placeholder: "Select API family",
+      onValueChange: (next) => onChange(next)
+    })]
+  });
 }
-function nextEnabledModelPatterns({ currentPatterns, enabled, model, models }) {
-  if (currentPatterns === void 0 && enabled) return void 0;
-  const current = currentPatterns ?? [];
-  const knownModelPatterns = new Set(models.map((item) => modelPatternFor(item)));
-  const activeKnown = /* @__PURE__ */ new Set();
-  for (const item of models) if (isModelEnabled(item, currentPatterns)) activeKnown.add(modelPatternFor(item));
-  if (enabled) activeKnown.add(modelPatternFor(model));
-  else activeKnown.delete(modelPatternFor(model));
-  return [...current.filter((pattern) => {
-    if (knownModelPatterns.has(pattern)) return false;
-    return enabled || !modelMatchesPattern(model, pattern);
-  }), ...activeKnown];
+function isOAuthProvider(provider) {
+  return provider.authType === "oauth";
 }
-function modelPatternFor(model) {
-  return modelPattern(model.provider, model.modelId);
+function supportsOAuth(provider) {
+  return provider.supportsOAuth === true;
 }
-function searchableModelText(model) {
-  return [
-    model.name,
-    model.modelId,
-    model.provider,
-    model.id
-  ].join(" ").toLowerCase();
+var CUSTOM_PROVIDER_PICKER_ROW = {
+  id: "custom",
+  name: "Custom provider",
+  isConfigured: false,
+  envVarName: "CUSTOM_PROVIDER_API_KEY",
+  displayName: "Custom provider"
+};
+function parseCustomProviderModels(raw) {
+  return raw.split(",").map((entry) => entry.trim()).filter((entry) => entry.length > 0);
 }
-function AddModelsDialog({ configuredProviderIds, discoverableProviderIds, discoveringProviderId, enabledModels, modelOptions, onAddModels, onDiscoverProvider, onOpenChange, open, providerLabel = formatProviderLabel }) {
-  const [filter, setFilter] = useState2("");
-  const [selectedKeys, setSelectedKeys] = useState2(/* @__PURE__ */ new Set());
-  const normalizedFilter = filter.trim().toLowerCase();
-  const candidateModels = useMemo2(() => {
-    return modelOptions.filter((model) => {
-      if (!configuredProviderIds.has(model.provider)) return false;
-      if (isModelEnabled(model, enabledModels)) return false;
-      return !normalizedFilter || searchableModelText(model).includes(normalizedFilter);
-    });
-  }, [
-    configuredProviderIds,
-    enabledModels,
-    modelOptions,
-    normalizedFilter
-  ]);
-  const groupedCandidates = useMemo2(() => {
-    const groups = /* @__PURE__ */ new Map();
-    for (const model of candidateModels) {
-      const existing = groups.get(model.provider);
-      if (existing) existing.push(model);
-      else groups.set(model.provider, [model]);
-    }
-    return [...groups.entries()];
-  }, [candidateModels]);
-  const discoverableProviders = useMemo2(() => {
-    const ids = discoverableProviderIds ?? configuredProviderIds;
-    return Array.from(ids).filter((id) => configuredProviderIds.has(id)).sort((a, b) => providerLabel(a).localeCompare(providerLabel(b)));
-  }, [
-    configuredProviderIds,
-    discoverableProviderIds,
-    providerLabel
-  ]);
-  const activeCountByProvider = useMemo2(() => {
-    const counts = /* @__PURE__ */ new Map();
-    for (const model of modelOptions) if (isModelEnabled(model, enabledModels)) counts.set(model.provider, (counts.get(model.provider) ?? 0) + 1);
-    return counts;
-  }, [enabledModels, modelOptions]);
-  const toggleSelected = (model) => {
-    setSelectedKeys((current) => {
-      const next = new Set(current);
-      if (next.has(model.id)) next.delete(model.id);
-      else next.add(model.id);
-      return next;
-    });
+function useProviderCredentialsController({ onRemoveProvider, onUpdateProvider, providers }) {
+  const [editingProvider, setEditingProvider] = useState2(null);
+  const [editingIsNewOccInstance, setEditingIsNewOccInstance] = useState2(false);
+  const [apiKey, setApiKey] = useState2("");
+  const [baseUrl, setBaseUrl] = useState2("");
+  const [modelId, setModelId] = useState2("");
+  const [models, setModels] = useState2("");
+  const [api, setApi] = useState2("openai-completions");
+  const [displayName, setDisplayName] = useState2("");
+  const [showPassword, setShowPassword] = useState2(false);
+  const [attemptedSave, setAttemptedSave] = useState2(false);
+  const [searchQuery, setSearchQuery] = useState2("");
+  const [addPickerOpen, setAddPickerOpen] = useState2(false);
+  const [addPickerQuery, setAddPickerQuery] = useState2("");
+  const [confirmRemoveProvider, setConfirmRemoveProvider] = useState2(null);
+  const credentialProviders = useMemo2(() => {
+    return [...providers.filter((provider) => provider.id !== CUSTOM_PROVIDER_PICKER_ROW.id), CUSTOM_PROVIDER_PICKER_ROW];
+  }, [providers]);
+  const activeProviders = useMemo2(() => credentialProviders.filter((provider) => provider.isConfigured), [credentialProviders]);
+  const unconfiguredProviders = useMemo2(() => credentialProviders.filter((provider) => !provider.isConfigured || provider.id === "openai-chat-completions" && provider.providerFamily === void 0), [credentialProviders]);
+  const filteredActiveProviders = useMemo2(() => {
+    const query = searchQuery.trim().toLowerCase();
+    if (!query) return activeProviders;
+    return activeProviders.filter((provider) => providerMatchesQuery(provider, query));
+  }, [activeProviders, searchQuery]);
+  const filteredPickerAvailable = useMemo2(() => {
+    const query = addPickerQuery.trim().toLowerCase();
+    return unconfiguredProviders.filter((provider) => providerMatchesQuery(provider, query));
+  }, [addPickerQuery, unconfiguredProviders]);
+  const filteredPickerConfigured = useMemo2(() => {
+    const query = addPickerQuery.trim().toLowerCase();
+    return activeProviders.filter((provider) => providerMatchesQuery(provider, query));
+  }, [activeProviders, addPickerQuery]);
+  const pickerHasResults = filteredPickerAvailable.length > 0 || filteredPickerConfigured.length > 0;
+  const editingUnconfiguredProvider = editingProvider && !activeProviders.some((provider) => provider.id === editingProvider) ? credentialProviders.find((entry) => entry.id === editingProvider) ?? null : null;
+  const resetEditor = () => {
+    setApiKey("");
+    setBaseUrl("");
+    setModelId("");
+    setModels("");
+    setApi("openai-completions");
+    setDisplayName("");
+    setShowPassword(false);
+    setAttemptedSave(false);
   };
-  const confirmAdd = () => {
-    const selected = candidateModels.filter((model) => selectedKeys.has(model.id));
-    if (selected.length > 0) onAddModels(selected);
-    onOpenChange(false);
+  const closeEditor = () => {
+    setEditingProvider(null);
+    setEditingIsNewOccInstance(false);
+    resetEditor();
   };
-  return /* @__PURE__ */ jsx(Dialog, {
-    open,
-    onOpenChange,
-    children: /* @__PURE__ */ jsxs(DialogContent, {
-      className: "max-w-lg",
-      children: [
-        /* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Add models" }), /* @__PURE__ */ jsxs(DialogDescription, { children: [
-          "Pick models discovered from your configured providers. For OpenAI Chat Completions, refresh runs",
-          " ",
-          /* @__PURE__ */ jsxs("span", {
-            className: "font-medium",
-            children: ["GET ", "{baseUrl}/models"]
-          }),
-          "."
-        ] })] }),
-        /* @__PURE__ */ jsx("div", {
-          className: "flex flex-wrap gap-1.5",
-          children: discoverableProviders.map((providerId) => {
-            const discovering = discoveringProviderId === providerId;
-            const activeCount = activeCountByProvider.get(providerId) ?? 0;
-            return /* @__PURE__ */ jsxs(Button, {
-              type: "button",
-              variant: "outline",
-              size: "sm",
-              disabled: discoveringProviderId !== null,
-              onClick: () => {
-                onDiscoverProvider(providerId);
-              },
-              children: [
-                discovering ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : /* @__PURE__ */ jsx(RefreshCw, { "data-icon": "inline-start" }),
-                providerLabel(providerId),
-                activeCount > 0 ? /* @__PURE__ */ jsxs("span", {
-                  className: "tabular-nums text-muted-foreground",
-                  children: [
-                    "\xB7 ",
-                    activeCount,
-                    " active"
-                  ]
-                }) : null
-              ]
-            }, providerId);
-          })
-        }),
-        /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, {
-          align: "inline-start",
-          children: /* @__PURE__ */ jsx(Search, {})
-        }), /* @__PURE__ */ jsx(InputGroupInput, {
-          "aria-label": "Search discovered models",
-          value: filter,
-          onChange: (event) => setFilter(event.target.value),
-          placeholder: "Search discovered models\u2026"
-        })] }),
-        /* @__PURE__ */ jsx("div", {
-          className: "max-h-72 overflow-y-auto",
-          children: groupedCandidates.length === 0 ? /* @__PURE__ */ jsx("p", {
-            className: "py-6 text-center text-xs text-pretty text-muted-foreground",
-            children: candidateModels.length === 0 && !normalizedFilter ? "All discovered models are already in your list, or none are available yet." : "No models match your search."
-          }) : /* @__PURE__ */ jsx("div", {
-            className: "flex flex-col gap-3",
-            children: groupedCandidates.map(([provider, models]) => /* @__PURE__ */ jsxs("div", {
-              className: "flex flex-col gap-1",
-              children: [/* @__PURE__ */ jsxs("div", {
-                className: "px-2 text-[0.6875rem] font-medium tracking-wide text-muted-foreground uppercase",
-                children: [providerLabel(provider), (activeCountByProvider.get(provider) ?? 0) > 0 ? /* @__PURE__ */ jsxs("span", {
-                  className: "ml-1 font-normal normal-case tabular-nums",
-                  children: [
-                    "\xB7 ",
-                    activeCountByProvider.get(provider),
-                    " active"
-                  ]
-                }) : null]
-              }), models.map((model) => {
-                const checked = selectedKeys.has(model.id);
-                return /* @__PURE__ */ jsxs("button", {
-                  type: "button",
-                  className: cn("flex w-full items-center gap-3 rounded-lg px-2 py-2 text-left transition-[background-color,transform] duration-150", "hover:bg-muted/60 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none active:scale-[0.96]", checked && "bg-muted/70"),
-                  "aria-pressed": checked,
-                  onClick: () => toggleSelected(model),
-                  children: [
-                    /* @__PURE__ */ jsx("div", {
-                      className: "flex size-8 shrink-0 items-center justify-center rounded-[4px] border border-border/40 bg-background/60",
-                      children: /* @__PURE__ */ jsx(ProviderBrandIcon, {
-                        provider: model.provider,
-                        className: "text-foreground/70"
-                      })
-                    }),
-                    /* @__PURE__ */ jsxs("div", {
-                      className: "min-w-0 flex-1",
-                      children: [/* @__PURE__ */ jsx("div", {
-                        className: "truncate text-sm font-medium",
-                        children: model.name
-                      }), /* @__PURE__ */ jsx("div", {
-                        className: "truncate text-xs text-muted-foreground",
-                        children: model.modelId
-                      })]
-                    }),
-                    /* @__PURE__ */ jsx("span", {
-                      className: cn("size-4 rounded border border-border/60", checked && "border-foreground bg-foreground"),
-                      "aria-hidden": true
-                    })
-                  ]
-                }, model.id);
-              })]
-            }, provider))
-          })
-        }),
-        /* @__PURE__ */ jsxs("div", {
-          className: "flex items-center justify-end gap-1.5",
-          children: [/* @__PURE__ */ jsx(Button, {
-            type: "button",
-            variant: "ghost",
-            size: "sm",
-            onClick: () => onOpenChange(false),
-            children: "Cancel"
-          }), /* @__PURE__ */ jsxs(Button, {
-            type: "button",
-            size: "sm",
-            disabled: selectedKeys.size === 0,
-            onClick: confirmAdd,
-            children: [
-              "Add",
-              " ",
-              selectedKeys.size > 0 ? /* @__PURE__ */ jsxs("span", {
-                className: "tabular-nums",
-                children: [
-                  "(",
-                  selectedKeys.size,
-                  ")"
-                ]
-              }) : null
-            ]
-          })]
-        })
-      ]
-    })
-  });
-}
-function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelFilter, modelOptions, onAddModels, onDiscoverProvider, onModelFilterChange, onRemoveModel, onSetDefaultModel, onRevert, onSave, providers, saving, settingsLoading }) {
-  const [addOpen, setAddOpen] = useState2(false);
-  const disabled2 = !draft || settingsLoading;
-  const normalizedFilter = modelFilter.trim().toLowerCase();
-  const configuredProviderIds = useMemo2(() => {
-    const ids = /* @__PURE__ */ new Set();
-    for (const provider of providers) if (provider.isConfigured) ids.add(provider.id);
-    for (const model of modelOptions) if (isModelEnabled(model, draft?.enabledModels)) ids.add(model.provider);
-    return ids;
-  }, [
-    draft?.enabledModels,
-    modelOptions,
-    providers
-  ]);
-  const discoverableProviderIds = useMemo2(() => {
-    const ids = /* @__PURE__ */ new Set();
-    for (const provider of providers) if (provider.discoverable === true && configuredProviderIds.has(provider.id)) ids.add(provider.id);
-    return ids;
-  }, [configuredProviderIds, providers]);
-  const isDefaultModel = useMemo2(() => {
-    return (model) => !!draft?.defaultProvider && !!draft?.defaultModel && model.provider === draft.defaultProvider && model.modelId === draft.defaultModel;
-  }, [draft?.defaultModel, draft?.defaultProvider]);
-  const providerLabel = useMemo2(() => {
-    const labels = /* @__PURE__ */ new Map();
-    for (const provider of providers) if (provider.displayName || provider.name) labels.set(provider.id, provider.displayName ?? provider.name ?? provider.id);
-    return (providerId) => labels.get(providerId) ?? formatProviderLabel(providerId);
-  }, [providers]);
-  const listedModels = useMemo2(() => {
-    return modelOptions.filter((model) => {
-      if (!isModelEnabled(model, draft?.enabledModels)) return false;
-      if (!normalizedFilter) return true;
-      return [
-        model.name,
-        model.modelId,
-        model.provider,
-        model.id
-      ].join(" ").toLowerCase().includes(normalizedFilter);
-    });
-  }, [
-    draft?.enabledModels,
-    modelOptions,
-    normalizedFilter
-  ]);
-  const groupedListed = useMemo2(() => {
-    const groups = /* @__PURE__ */ new Map();
-    for (const model of listedModels) {
-      const existing = groups.get(model.provider);
-      if (existing) existing.push(model);
-      else groups.set(model.provider, [model]);
+  const openEditor = (providerId, opts) => {
+    setAddPickerOpen(false);
+    setAddPickerQuery("");
+    setEditingProvider(providerId);
+    setEditingIsNewOccInstance(opts?.newOccInstance === true);
+    resetEditor();
+    const existing = providers.find((provider) => provider.id === providerId);
+    setBaseUrl(existing?.baseUrl ?? "");
+    setDisplayName(existing?.displayName ?? (isCustomProviderId(providerId) ? existing?.name ?? "" : ""));
+    setApi(existing?.api ?? "openai-completions");
+    setModels((existing?.modelIds ?? []).join(", "));
+    setModelId(existing?.modelIds?.[0] ?? "");
+  };
+  const openAddPicker = () => {
+    closeEditor();
+    setAddPickerQuery("");
+    setAddPickerOpen(true);
+  };
+  const closeAddPicker = () => {
+    setAddPickerOpen(false);
+    setAddPickerQuery("");
+  };
+  const selectProviderFromPicker = (providerId) => {
+    openEditor(providerId, { newOccInstance: isOccProviderId(providerId) });
+  };
+  const handleSave = async (providerId) => {
+    if (!onUpdateProvider) return;
+    setAttemptedSave(true);
+    const isCustomEditor = providerId === "custom" || isCustomProviderId(providerId);
+    const openAiChat = isOccProviderId(providerId);
+    if (isCustomEditor) {
+      const modelList = parseCustomProviderModels(models);
+      if (!apiKey.trim() || !baseUrl.trim() || !displayName.trim()) return;
+      if (modelList.length === 0) return;
+      try {
+        await onUpdateProvider({
+          providerId,
+          apiKey: apiKey.trim(),
+          baseUrl: baseUrl.trim(),
+          displayName: displayName.trim(),
+          api,
+          models: modelList,
+          ...providerId === "custom" ? { createOccInstance: true } : {}
+        });
+        notify.success("Provider credentials applied to your active sessions.");
+        closeEditor();
+        closeAddPicker();
+      } catch (error) {
+        notify.error(error instanceof Error ? error.message : "Failed to update provider");
+      }
+      return;
+    }
+    const isNamedOcc = openAiChat && isNamedOccInstanceId(providerId);
+    const isOccLike = openAiChat && (isNamedOcc || editingIsNewOccInstance);
+    if (!apiKey.trim()) return;
+    if (openAiChat && (!baseUrl.trim() || !modelId.trim())) return;
+    if (isOccLike && !displayName.trim()) return;
+    try {
+      await onUpdateProvider({
+        providerId,
+        apiKey: apiKey.trim(),
+        ...openAiChat ? {
+          baseUrl: baseUrl.trim(),
+          modelId: modelId.trim(),
+          ...isOccLike ? { displayName: displayName.trim() } : {},
+          ...editingIsNewOccInstance ? { createOccInstance: true } : {}
+        } : {}
+      });
+      notify.success("Provider credentials applied to your active sessions.");
+      closeEditor();
+      closeAddPicker();
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Failed to update provider");
     }
-    return [...groups.entries()];
-  }, [listedModels]);
-  const emptyMessage = (() => {
-    if (modelOptions.length === 0) return "No models discovered yet. Configure a provider, then add models.";
-    if (listedModels.length === 0 && !normalizedFilter) return "Add models from your configured providers to make them available in chat.";
-    if (listedModels.length === 0) return "No models match your search.";
-    return null;
-  })();
-  const openAddDialog = () => {
-    setAddOpen(true);
   };
-  return /* @__PURE__ */ jsxs(SettingsPane, {
-    title: "LLM Models",
-    description: /* @__PURE__ */ jsxs(Fragment$1, { children: [
-      "Models available in chat. Discover from configured providers, add the ones you want, and remove any you do not need \u2014 changes save automatically.",
-      " ",
-      /* @__PURE__ */ jsx("span", {
-        className: "tabular-nums",
-        children: listedModels.length
-      }),
-      " in list",
-      modelOptions.length > 0 ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
-        " ",
-        "\xB7 ",
-        /* @__PURE__ */ jsx("span", {
-          className: "tabular-nums",
-          children: modelOptions.length
-        }),
-        " ",
-        "discovered"
-      ] }) : null,
-      "."
-    ] }),
-    actions: /* @__PURE__ */ jsx(SettingsCommitActions, {
-      dirty: modelDirty,
-      disabled: disabled2,
-      onRevert,
-      onSave,
-      saving
-    }),
+  const handleRemove = async (provider) => {
+    if (!onRemoveProvider) return;
+    try {
+      await onRemoveProvider({ providerId: provider.id });
+      if (editingProvider === provider.id) closeEditor();
+      notify.success(`${provider.name} removed from your configured providers.`);
+      setConfirmRemoveProvider(null);
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Failed to remove provider");
+    }
+  };
+  return {
+    activeProviders,
+    addPickerOpen,
+    addPickerQuery,
+    api,
+    apiKey,
+    attemptedSave,
+    baseUrl,
+    canSave: useMemo2(() => {
+      if (apiKey.trim().length === 0) return false;
+      if (!editingProvider) return true;
+      if (editingProvider === "custom" || isCustomProviderId(editingProvider)) {
+        if (baseUrl.trim().length === 0) return false;
+        if (parseCustomProviderModels(models).length === 0) return false;
+        return displayName.trim().length > 0;
+      }
+      if (!isOccProviderId(editingProvider)) return true;
+      if (baseUrl.trim().length === 0 || modelId.trim().length === 0) return false;
+      if (isNamedOccInstanceId(editingProvider) || editingIsNewOccInstance) return displayName.trim().length > 0;
+      return true;
+    }, [
+      apiKey,
+      baseUrl,
+      modelId,
+      models,
+      displayName,
+      editingProvider,
+      editingIsNewOccInstance
+    ]),
+    closeAddPicker,
+    closeEditor,
+    confirmRemoveProvider,
+    credentialProviders,
+    displayName,
+    editingIsNewOccInstance,
+    editingProvider,
+    editingUnconfiguredProvider,
+    filteredActiveProviders,
+    filteredPickerAvailable,
+    filteredPickerConfigured,
+    handleRemove,
+    handleSave,
+    modelId,
+    models,
+    openAddPicker,
+    openEditor,
+    pickerHasResults,
+    resetEditor,
+    searchQuery,
+    selectProviderFromPicker,
+    setAddPickerOpen,
+    setAddPickerQuery,
+    setApi,
+    setApiKey,
+    setAttemptedSave,
+    setBaseUrl,
+    setConfirmRemoveProvider,
+    setDisplayName,
+    setEditingIsNewOccInstance,
+    setEditingProvider,
+    setModelId,
+    setModels,
+    setSearchQuery,
+    setShowPassword,
+    showPassword,
+    unconfiguredProviders
+  };
+}
+function providerMatchesQuery(provider, query) {
+  if (!query) return true;
+  const keywords = supportsOAuth(provider) ? isOAuthProvider(provider) ? "oauth sign-in login" : "api key oauth sign-in login" : provider.id === "custom" || isCustomProviderId(provider.id) ? "custom provider endpoint openai anthropic google compatible" : isOccProviderId(provider.id) ? "api key base url model name chat completions" : "";
+  return [
+    provider.name,
+    provider.envVarName,
+    provider.id,
+    keywords
+  ].join(" ").toLowerCase().includes(query);
+}
+function AddProviderPickerPanel({ addPickerQuery, credentialProvidersLength, filteredPickerAvailable, filteredPickerConfigured, pickerHasResults, onClose, onQueryChange, onSelect }) {
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-3",
     children: [
       /* @__PURE__ */ jsxs("div", {
         className: "flex items-center gap-2",
-        children: [/* @__PURE__ */ jsxs(InputGroup, {
-          className: "flex-1",
-          children: [/* @__PURE__ */ jsx(InputGroupAddon, {
-            align: "inline-start",
-            children: /* @__PURE__ */ jsx(Search, {})
-          }), /* @__PURE__ */ jsx(InputGroupInput, {
-            "aria-label": "Search listed models",
-            value: modelFilter,
-            onChange: (event) => onModelFilterChange(event.target.value),
-            placeholder: "Search listed models\u2026",
-            disabled: disabled2 || listedModels.length === 0
-          })]
-        }), /* @__PURE__ */ jsxs(Button, {
+        children: [/* @__PURE__ */ jsx(Button, {
           type: "button",
-          variant: "outline",
-          size: "sm",
-          disabled: disabled2,
-          onClick: openAddDialog,
-          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
+          variant: "ghost",
+          size: "icon-sm",
+          "aria-label": "Back to providers",
+          onClick: onClose,
+          children: /* @__PURE__ */ jsx(ArrowLeft, {})
+        }), /* @__PURE__ */ jsxs("div", {
+          className: "min-w-0 flex-1",
+          children: [/* @__PURE__ */ jsx("p", {
+            className: "text-sm font-medium",
+            children: "Add provider"
+          }), /* @__PURE__ */ jsx("p", {
+            className: "text-xs text-pretty text-muted-foreground",
+            children: "Choose a provider to store encrypted credentials for this account."
+          })]
         })]
       }),
+      /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupAddon, {
+        align: "inline-start",
+        children: /* @__PURE__ */ jsx(Search, {})
+      }), /* @__PURE__ */ jsx(InputGroupInput, {
+        type: "text",
+        placeholder: "Search providers\u2026",
+        value: addPickerQuery,
+        onChange: (event) => onQueryChange(event.target.value),
+        "aria-label": "Search providers to add"
+      })] }),
       /* @__PURE__ */ jsx("div", {
-        className: "flex flex-col gap-3",
-        "data-testid": "runtime-models-list",
-        children: emptyMessage ? /* @__PURE__ */ jsxs("div", {
-          className: "flex flex-col items-center gap-3 py-8",
-          children: [/* @__PURE__ */ jsx("p", {
-            className: "px-1 text-center text-xs text-pretty text-muted-foreground",
-            children: emptyMessage
-          }), !normalizedFilter ? /* @__PURE__ */ jsxs(Button, {
-            type: "button",
-            variant: "outline",
-            size: "sm",
-            disabled: disabled2,
-            onClick: openAddDialog,
-            children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
+        className: "max-h-[min(24rem,50vh)] overflow-y-auto",
+        children: !pickerHasResults ? /* @__PURE__ */ jsx("p", {
+          className: "py-6 text-center text-xs text-pretty text-muted-foreground",
+          children: credentialProvidersLength === 0 ? "No providers available." : "No matching providers found."
+        }) : /* @__PURE__ */ jsxs("div", {
+          className: "flex flex-col gap-3",
+          children: [filteredPickerAvailable.length > 0 ? /* @__PURE__ */ jsx("div", {
+            className: "flex flex-col gap-1",
+            children: filteredPickerAvailable.map((provider) => /* @__PURE__ */ jsx(ProviderPickerRow, {
+              provider,
+              configured: false,
+              onSelect: () => onSelect(provider.id)
+            }, provider.id))
+          }) : null, filteredPickerConfigured.length > 0 ? /* @__PURE__ */ jsxs("div", {
+            className: "flex flex-col gap-1",
+            children: [filteredPickerAvailable.length > 0 ? /* @__PURE__ */ jsx("p", {
+              className: "px-2 pt-1 text-[0.6875rem] font-medium tracking-wide text-muted-foreground uppercase",
+              children: "Already configured"
+            }) : null, filteredPickerConfigured.map((provider) => /* @__PURE__ */ jsx(ProviderPickerRow, {
+              provider,
+              configured: true,
+              onSelect: () => onSelect(provider.id)
+            }, provider.id))]
           }) : null]
-        }) : groupedListed.map(([provider, models]) => /* @__PURE__ */ jsxs("div", {
-          className: "flex flex-col gap-1.5",
-          children: [/* @__PURE__ */ jsx("div", {
-            className: "px-1 text-xs font-medium text-muted-foreground",
-            children: providerLabel(provider)
-          }), models.map((model) => /* @__PURE__ */ jsx(ItemRow, {
-            icon: /* @__PURE__ */ jsx(ProviderBrandIcon, { provider: model.provider }),
-            title: model.name,
-            subtitle: `${providerLabel(model.provider)} \xB7 ${model.modelId}`,
-            trailing: /* @__PURE__ */ jsxs("div", {
-              className: "flex items-center",
-              children: [isDefaultModel(model) ? /* @__PURE__ */ jsx("span", {
-                className: "px-2 text-xs font-medium text-muted-foreground",
-                children: "Default"
-              }) : onSetDefaultModel ? /* @__PURE__ */ jsxs(Button, {
-                type: "button",
-                variant: "ghost",
-                size: "sm",
-                className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 active:scale-[0.96]"),
-                disabled: disabled2,
-                "aria-label": `Set ${model.name} as default`,
-                onClick: () => onSetDefaultModel(model),
-                children: [/* @__PURE__ */ jsx(Star, { "data-icon": "inline-start" }), "Set default"]
-              }) : null, /* @__PURE__ */ jsxs(Button, {
-                type: "button",
-                variant: "ghost",
-                size: "sm",
-                className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 hover:text-destructive active:scale-[0.96]"),
-                disabled: disabled2,
-                "aria-label": `Remove ${model.name}`,
-                onClick: () => onRemoveModel(model),
-                children: [/* @__PURE__ */ jsx(Trash2, { "data-icon": "inline-start" }), "Remove"]
-              })]
-            })
-          }, model.id))]
-        }, provider))
-      }),
-      /* @__PURE__ */ jsx(AddModelsDialog, {
-        open: addOpen,
-        configuredProviderIds,
-        discoverableProviderIds,
-        discoveringProviderId,
-        enabledModels: draft?.enabledModels,
-        modelOptions,
-        onAddModels,
-        onDiscoverProvider,
-        onOpenChange: setAddOpen,
-        providerLabel
+        })
       })
     ]
   });
 }
-var TRANSPORT_OPTIONS = [
-  {
-    value: "auto",
-    label: "Auto"
-  },
-  {
-    value: "sse",
-    label: "SSE"
-  },
-  {
-    value: "websocket",
-    label: "WebSocket"
-  }
-];
-var DELIVERY_OPTIONS = [{
-  value: "all",
-  label: "All"
-}, {
-  value: "one-at-a-time",
-  label: "One at a time"
-}];
-function HarnessRuntimeSection({ draft, updateDraft }) {
-  const disabled2 = !draft;
+function AddProviderOAuthPanel({ onBack, onConfigured, onOAuthLogin, provider }) {
   return /* @__PURE__ */ jsxs("div", {
-    className: "flex flex-col gap-2",
+    className: "flex flex-col gap-3",
+    children: [/* @__PURE__ */ jsxs("div", {
+      className: "flex items-center gap-2",
+      children: [/* @__PURE__ */ jsx(Button, {
+        type: "button",
+        variant: "ghost",
+        size: "icon-sm",
+        "aria-label": "Back to provider list",
+        onClick: onBack,
+        children: /* @__PURE__ */ jsx(ArrowLeft, {})
+      }), /* @__PURE__ */ jsxs("div", {
+        className: "min-w-0 flex-1",
+        children: [/* @__PURE__ */ jsxs("p", {
+          className: "text-sm font-medium",
+          children: ["Configure ", provider.name]
+        }), /* @__PURE__ */ jsx("p", {
+          className: "text-xs text-pretty text-muted-foreground",
+          children: "OAuth sign-in. Credentials are stored in auth.json for this account."
+        })]
+      })]
+    }), /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
+      provider,
+      onConfigured,
+      onOAuthLogin
+    }, provider.id)]
+  });
+}
+function AddProviderEditorPanel({ provider, api, apiKey, baseUrl, modelId, models, displayName, showPassword, attemptedSave, isPending, canSave, onApiKeyChange, onApiChange, onBaseUrlChange, onModelIdChange, onModelsChange, onDisplayNameChange, onTogglePassword, onBack, onCancel, onConfigured, onOAuthLogin, onSave }) {
+  const isCustomTemplate = provider.id === "custom" || isCustomProviderId(provider.id);
+  const meta = PROVIDER_METADATA[provider.id] ?? (isCustomTemplate ? PROVIDER_METADATA["custom"] : {
+    placeholder: "Enter credentials\u2026",
+    help: "Stored securely in your local environment overrides."
+  });
+  const openAiChat = isOccProviderId(provider.id) && !isCustomTemplate;
+  const oauthAvailable = supportsOAuth(provider);
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-3",
     children: [
-      /* @__PURE__ */ jsx(ItemRow, {
-        title: "Compaction",
-        subtitle: "Summarize old turns when context fills up",
-        trailing: /* @__PURE__ */ jsx(Switch, {
-          "aria-label": "Compaction",
-          checked: draft?.compaction.enabled ?? false,
-          disabled: disabled2,
-          onCheckedChange: (enabled) => updateDraft((current) => ({
-            ...current,
-            compaction: {
-              ...current.compaction,
-              enabled
-            }
-          }))
-        })
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex items-center gap-2",
+        children: [/* @__PURE__ */ jsx(Button, {
+          type: "button",
+          variant: "ghost",
+          size: "icon-sm",
+          "aria-label": "Back to provider list",
+          onClick: onBack,
+          children: /* @__PURE__ */ jsx(ArrowLeft, {})
+        }), /* @__PURE__ */ jsxs("div", {
+          className: "min-w-0 flex-1",
+          children: [/* @__PURE__ */ jsxs("p", {
+            className: "text-sm font-medium",
+            children: ["Configure ", provider.name]
+          }), /* @__PURE__ */ jsx("p", {
+            className: "text-xs text-pretty text-muted-foreground",
+            children: isCustomTemplate ? "Name this custom provider, pick its API family, then enter its API key, https base URL, and model ids." : openAiChat ? "Name this OpenAI-compatible provider, then enter its API key, base URL, and model name." : `Stored as ${provider.envVarName} for this account.`
+          })]
+        })]
       }),
-      /* @__PURE__ */ jsx(ItemRow, {
-        title: "Auto-retry",
-        subtitle: "Retry failed provider requests",
-        trailing: /* @__PURE__ */ jsx(Switch, {
-          "aria-label": "Auto-retry",
-          checked: draft?.retry.enabled ?? false,
-          disabled: disabled2,
-          onCheckedChange: (enabled) => updateDraft((current) => ({
-            ...current,
-            retry: {
-              ...current.retry,
-              enabled
-            }
-          }))
-        })
+      /* @__PURE__ */ jsx(ProviderCredentialFields, {
+        attemptedSave,
+        api,
+        apiKey,
+        baseUrl,
+        modelId,
+        models,
+        displayName,
+        isCustom: isCustomTemplate,
+        openAiChat,
+        placeholder: meta.placeholder,
+        showPassword,
+        onApiKeyChange,
+        onApiChange,
+        onBaseUrlChange,
+        onModelIdChange,
+        onModelsChange,
+        onDisplayNameChange,
+        onTogglePassword
       }),
-      /* @__PURE__ */ jsx(ItemRow, {
-        title: "Transport",
-        trailing: /* @__PURE__ */ jsx(Select, {
-          "aria-label": "Transport",
-          className: "w-[160px]",
-          disabled: disabled2,
-          onValueChange: (value) => updateDraft((current) => ({
-            ...current,
-            transport: value
-          })),
-          options: [...TRANSPORT_OPTIONS],
-          value: draft?.transport ?? "auto"
-        })
+      /* @__PURE__ */ jsxs(Alert, {
+        className: "px-3 py-2",
+        children: [/* @__PURE__ */ jsx(Info, {}), /* @__PURE__ */ jsx(AlertDescription, {
+          className: "text-xs text-pretty",
+          children: meta.help
+        })]
       }),
-      /* @__PURE__ */ jsx(ItemRow, {
-        title: "Steering",
-        subtitle: "How queued steers are delivered mid-turn",
-        trailing: /* @__PURE__ */ jsx(Select, {
-          "aria-label": "Steering",
-          className: "w-[160px]",
-          disabled: disabled2,
-          onValueChange: (value) => updateDraft((current) => ({
-            ...current,
-            steeringMode: value
-          })),
-          options: [...DELIVERY_OPTIONS],
-          value: draft?.steeringMode ?? "all"
-        })
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex items-center justify-end gap-1.5",
+        children: [/* @__PURE__ */ jsx(Button, {
+          type: "button",
+          variant: "ghost",
+          size: "sm",
+          onClick: onCancel,
+          children: "Cancel"
+        }), /* @__PURE__ */ jsxs(Button, {
+          type: "button",
+          size: "sm",
+          disabled: isPending || !canSave,
+          onClick: onSave,
+          children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
+        })]
       }),
-      /* @__PURE__ */ jsx(ItemRow, {
-        title: "Follow-up",
-        subtitle: "How queued follow-ups run after the turn",
-        trailing: /* @__PURE__ */ jsx(Select, {
-          "aria-label": "Follow-up",
-          className: "w-[160px]",
-          disabled: disabled2,
-          onValueChange: (value) => updateDraft((current) => ({
-            ...current,
-            followUpMode: value
-          })),
-          options: [...DELIVERY_OPTIONS],
-          value: draft?.followUpMode ?? "all"
-        })
-      })
+      oauthAvailable ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
+        provider,
+        onConfigured: onConfigured ?? onCancel,
+        onOAuthLogin
+      }, `${provider.id}-oauth`) : null
     ]
   });
 }
+function RemoveProviderConfirmDialog({ confirmRemoveProvider, isPending, onClose, onConfirm }) {
+  return /* @__PURE__ */ jsx(AlertDialog, {
+    open: confirmRemoveProvider !== null,
+    onOpenChange: (open) => {
+      if (!open) onClose();
+    },
+    children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-2",
+      children: [/* @__PURE__ */ jsxs(AlertDialogTitle, { children: [
+        "Remove ",
+        confirmRemoveProvider?.name ?? "provider",
+        "?"
+      ] }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: "This clears stored credentials for this provider from your workspace settings. Active sessions will stop using it immediately." })]
+    }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, {
+      disabled: isPending,
+      children: "Cancel"
+    }), /* @__PURE__ */ jsxs(AlertDialogAction, {
+      disabled: isPending || !confirmRemoveProvider,
+      onClick: () => {
+        if (confirmRemoveProvider) onConfirm(confirmRemoveProvider);
+      },
+      children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Remove provider"]
+    })] })] })
+  });
+}
+function ProviderPickerRow({ configured, onSelect, provider }) {
+  const openAiChat = isOccProviderId(provider.id);
+  const isCustomTemplate = provider.id === "custom" || isCustomProviderId(provider.id);
+  const oauthOnly = isOAuthProvider(provider);
+  const oauthAvailable = supportsOAuth(provider);
+  return /* @__PURE__ */ jsxs("button", {
+    type: "button",
+    className: cn("flex w-full items-center gap-3 rounded-lg px-2 py-2 text-left transition-[background-color,transform] duration-150", "hover:bg-muted/60 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none active:scale-[0.96]"),
+    onClick: onSelect,
+    children: [/* @__PURE__ */ jsx("div", {
+      className: "flex size-8 shrink-0 items-center justify-center rounded-[4px] border border-border/40 bg-background/60",
+      children: /* @__PURE__ */ jsx(ProviderBrandIcon, {
+        provider: isCustomTemplate ? "custom" : provider.id,
+        api: provider.api,
+        className: "text-foreground/70"
+      })
+    }), /* @__PURE__ */ jsxs("div", {
+      className: "min-w-0 flex-1",
+      children: [/* @__PURE__ */ jsx("div", {
+        className: "truncate text-sm font-medium",
+        children: provider.name
+      }), /* @__PURE__ */ jsxs("div", {
+        className: "truncate text-xs text-muted-foreground",
+        children: [oauthOnly ? "OAuth sign-in" : oauthAvailable ? "API key or OAuth" : isCustomTemplate ? "API family + key + https base URL + models" : openAiChat ? "API key + base URL + model name" : provider.envVarName, configured ? " \xB7 Update" : ""]
+      })]
+    })]
+  });
+}
+function ActiveProviderList({ providers, editingProvider, form, operation, actions, onEdit, onCancelEdit, onSave, onRemove, onOAuthLogin, onConfigured }) {
+  const { api, apiKey, baseUrl, modelId, models, displayName, showPassword, attemptedSave, canSave } = form;
+  const { isPending, canRemove } = operation;
+  const { onApiKeyChange, onApiChange, onBaseUrlChange, onModelIdChange, onModelsChange, onDisplayNameChange, onTogglePassword } = actions;
+  return /* @__PURE__ */ jsx("div", {
+    className: "flex flex-col gap-1.5",
+    children: providers.map((provider) => {
+      const isEditing = editingProvider === provider.id;
+      const isCustom = isCustomProviderId(provider.id);
+      const meta = PROVIDER_METADATA[provider.id] ?? PROVIDER_METADATA[isCustom ? "custom" : "openai-chat-completions"];
+      const openAiChat = isOccProviderId(provider.id);
+      const oauthOnly = isOAuthProvider(provider);
+      const oauthAvailable = supportsOAuth(provider);
+      return /* @__PURE__ */ jsxs("div", {
+        className: "flex flex-col",
+        children: [/* @__PURE__ */ jsx(ItemRow, {
+          interactive: false,
+          icon: /* @__PURE__ */ jsx(ProviderBrandIcon, {
+            provider: provider.id,
+            api: provider.api,
+            className: "text-foreground/80"
+          }),
+          title: provider.name,
+          subtitle: oauthOnly ? "OAuth sign-in" : oauthAvailable ? "API key or OAuth" : isCustom ? "Custom provider \xB7 API key + base URL + models" : openAiChat ? "OpenAI-compatible \xB7 API key + base URL + model name" : provider.envVarName,
+          trailing: /* @__PURE__ */ jsxs("div", {
+            className: "flex items-center gap-0.5",
+            children: [/* @__PURE__ */ jsxs(Button, {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 hover:text-destructive active:scale-[0.96]"),
+              disabled: isPending || !canRemove,
+              "aria-label": `Remove ${provider.name}`,
+              onClick: () => onRemove(provider),
+              children: [/* @__PURE__ */ jsx(Trash2, { "data-icon": "inline-start" }), "Remove"]
+            }), /* @__PURE__ */ jsxs(Button, {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs transition-[background-color,transform] duration-150 active:scale-[0.96]"),
+              disabled: isPending,
+              onClick: () => {
+                if (isEditing) {
+                  onCancelEdit();
+                  return;
+                }
+                onEdit(provider.id);
+              },
+              children: [!isEditing ? /* @__PURE__ */ jsx(Pencil, { "data-icon": "inline-start" }) : null, isEditing ? "Cancel" : "Update"]
+            })]
+          })
+        }), isEditing ? /* @__PURE__ */ jsx(RowSurface, {
+          tone: "inset",
+          padding: "md",
+          className: "flex flex-col gap-2 border-t border-border/30",
+          children: oauthOnly ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
+            provider,
+            onConfigured,
+            onOAuthLogin
+          }, provider.id) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+            /* @__PURE__ */ jsx(ProviderCredentialFields, {
+              attemptedSave,
+              api: provider.api ?? api,
+              apiKey,
+              baseUrl,
+              modelId,
+              models,
+              displayName,
+              isCustom,
+              openAiChat,
+              placeholder: meta.placeholder,
+              showPassword,
+              onApiKeyChange,
+              onApiChange,
+              onBaseUrlChange,
+              onModelIdChange,
+              onModelsChange,
+              onDisplayNameChange: isCustom || provider.providerFamily !== void 0 ? onDisplayNameChange : void 0,
+              onTogglePassword
+            }),
+            /* @__PURE__ */ jsxs(Alert, {
+              className: "px-3 py-2",
+              children: [/* @__PURE__ */ jsx(Info, {}), /* @__PURE__ */ jsx(AlertDescription, {
+                className: "text-xs text-pretty",
+                children: meta.help
+              })]
+            }),
+            /* @__PURE__ */ jsx("div", {
+              className: "flex items-center justify-end",
+              children: /* @__PURE__ */ jsxs(Button, {
+                type: "button",
+                size: "sm",
+                disabled: isPending || !canSave,
+                onClick: () => onSave(provider.id),
+                children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
+              })
+            }),
+            oauthAvailable ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
+              provider,
+              onConfigured,
+              onOAuthLogin
+            }, `${provider.id}-oauth`) : null
+          ] })
+        }) : null]
+      }, provider.id);
+    })
+  });
+}
+function ProviderCredentialsSection({ isLoading, isPending, onOAuthLogin, onRemoveProvider, onUpdateProvider, providers }) {
+  const { activeProviders, addPickerOpen, addPickerQuery, api, apiKey, attemptedSave, baseUrl, canSave, closeAddPicker, closeEditor, confirmRemoveProvider, credentialProviders, displayName, editingProvider, editingUnconfiguredProvider, filteredActiveProviders, filteredPickerAvailable, filteredPickerConfigured, handleRemove, handleSave, modelId, models, openAddPicker, openEditor, pickerHasResults, searchQuery, selectProviderFromPicker, setAddPickerQuery, setApi, setApiKey, setBaseUrl, setConfirmRemoveProvider, setDisplayName, setModelId, setModels, setSearchQuery, setShowPassword, showPassword } = useProviderCredentialsController({
+    onRemoveProvider,
+    onUpdateProvider,
+    providers
+  });
+  const form = {
+    api,
+    apiKey,
+    baseUrl,
+    modelId,
+    models,
+    displayName,
+    showPassword,
+    attemptedSave,
+    canSave
+  };
+  const operation = {
+    isPending,
+    canRemove: Boolean(onRemoveProvider)
+  };
+  const actions = {
+    onApiKeyChange: setApiKey,
+    onApiChange: setApi,
+    onBaseUrlChange: setBaseUrl,
+    onModelIdChange: setModelId,
+    onModelsChange: setModels,
+    onDisplayNameChange: setDisplayName,
+    onTogglePassword: () => setShowPassword((current) => !current)
+  };
+  return /* @__PURE__ */ jsxs(SettingsPane, {
+    title: "Providers",
+    description: "Locally, API keys are stored in `.env.local`. When deployed, they are stored encrypted in your account.",
+    children: [addPickerOpen ? /* @__PURE__ */ jsx(AddProviderPickerPanel, {
+      addPickerQuery,
+      credentialProvidersLength: credentialProviders.length,
+      filteredPickerAvailable,
+      filteredPickerConfigured,
+      pickerHasResults,
+      onClose: closeAddPicker,
+      onQueryChange: setAddPickerQuery,
+      onSelect: selectProviderFromPicker
+    }) : editingUnconfiguredProvider && isOAuthProvider(editingUnconfiguredProvider) ? /* @__PURE__ */ jsx(AddProviderOAuthPanel, {
+      provider: editingUnconfiguredProvider,
+      onBack: openAddPicker,
+      onConfigured: closeEditor,
+      onOAuthLogin
+    }, editingUnconfiguredProvider.id) : editingUnconfiguredProvider ? /* @__PURE__ */ jsx(AddProviderEditorPanel, {
+      provider: editingUnconfiguredProvider,
+      api,
+      apiKey,
+      baseUrl,
+      modelId,
+      models,
+      displayName,
+      showPassword,
+      attemptedSave,
+      isPending,
+      canSave,
+      onApiKeyChange: setApiKey,
+      onApiChange: setApi,
+      onBaseUrlChange: setBaseUrl,
+      onModelIdChange: setModelId,
+      onModelsChange: setModels,
+      onDisplayNameChange: setDisplayName,
+      onTogglePassword: () => setShowPassword((current) => !current),
+      onBack: openAddPicker,
+      onCancel: closeEditor,
+      onConfigured: closeEditor,
+      onOAuthLogin,
+      onSave: () => {
+        if (editingProvider) handleSave(editingProvider);
+      }
+    }) : /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-3",
+      children: [/* @__PURE__ */ jsxs("div", {
+        className: "flex items-center gap-2",
+        children: [/* @__PURE__ */ jsxs(InputGroup, {
+          className: "flex-1",
+          children: [/* @__PURE__ */ jsx(InputGroupAddon, {
+            align: "inline-start",
+            children: /* @__PURE__ */ jsx(Search, {})
+          }), /* @__PURE__ */ jsx(InputGroupInput, {
+            type: "text",
+            placeholder: "Search credentials\u2026",
+            value: searchQuery,
+            onChange: (event) => setSearchQuery(event.target.value),
+            "aria-label": "Search credentials",
+            disabled: isLoading || activeProviders.length === 0
+          })]
+        }), /* @__PURE__ */ jsxs(Button, {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          disabled: isLoading || credentialProviders.length === 0,
+          onClick: openAddPicker,
+          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add provider"]
+        })]
+      }), isLoading ? /* @__PURE__ */ jsxs("div", {
+        className: "flex items-center justify-center gap-2 py-6 text-xs text-muted-foreground",
+        children: [/* @__PURE__ */ jsx(Spinner, { className: "size-3" }), /* @__PURE__ */ jsx("span", { children: "Loading\u2026" })]
+      }) : activeProviders.length === 0 ? /* @__PURE__ */ jsxs("div", {
+        className: "flex flex-col items-center gap-3 py-8",
+        children: [/* @__PURE__ */ jsx("p", {
+          className: "text-center text-xs text-pretty text-muted-foreground",
+          children: "No providers configured"
+        }), /* @__PURE__ */ jsxs(Button, {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          disabled: credentialProviders.length === 0,
+          onClick: openAddPicker,
+          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add provider"]
+        })]
+      }) : filteredActiveProviders.length === 0 ? /* @__PURE__ */ jsx("p", {
+        className: "py-6 text-center text-xs text-pretty text-muted-foreground",
+        children: "No matching providers found."
+      }) : /* @__PURE__ */ jsx(ActiveProviderList, {
+        providers: filteredActiveProviders,
+        editingProvider,
+        form,
+        operation,
+        actions,
+        onEdit: openEditor,
+        onCancelEdit: closeEditor,
+        onSave: (providerId) => void handleSave(providerId),
+        onRemove: setConfirmRemoveProvider,
+        onOAuthLogin,
+        onConfigured: closeEditor
+      })]
+    }), /* @__PURE__ */ jsx(RemoveProviderConfirmDialog, {
+      confirmRemoveProvider,
+      isPending,
+      onClose: () => setConfirmRemoveProvider(null),
+      onConfirm: (provider) => {
+        handleRemove(provider);
+      }
+    })]
+  });
+}
 var PROVENANCE_SOURCES = /* @__PURE__ */ new Set([
   "auto",
   "global",
@@ -4464,6 +4349,111 @@ function CatalogValueList({ addLabel, catalog, onChange, placeholder, values })
     })] })]
   });
 }
+var TRANSPORT_OPTIONS = [
+  {
+    value: "auto",
+    label: "Auto"
+  },
+  {
+    value: "sse",
+    label: "SSE"
+  },
+  {
+    value: "websocket",
+    label: "WebSocket"
+  }
+];
+var DELIVERY_OPTIONS = [{
+  value: "all",
+  label: "All"
+}, {
+  value: "one-at-a-time",
+  label: "One at a time"
+}];
+function HarnessRuntimeSection({ draft, updateDraft }) {
+  const disabled2 = !draft;
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-2",
+    children: [
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Compaction",
+        subtitle: "Summarize old turns when context fills up",
+        trailing: /* @__PURE__ */ jsx(Switch, {
+          "aria-label": "Compaction",
+          checked: draft?.compaction.enabled ?? false,
+          disabled: disabled2,
+          onCheckedChange: (enabled) => updateDraft((current) => ({
+            ...current,
+            compaction: {
+              ...current.compaction,
+              enabled
+            }
+          }))
+        })
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Auto-retry",
+        subtitle: "Retry failed provider requests",
+        trailing: /* @__PURE__ */ jsx(Switch, {
+          "aria-label": "Auto-retry",
+          checked: draft?.retry.enabled ?? false,
+          disabled: disabled2,
+          onCheckedChange: (enabled) => updateDraft((current) => ({
+            ...current,
+            retry: {
+              ...current.retry,
+              enabled
+            }
+          }))
+        })
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Transport",
+        trailing: /* @__PURE__ */ jsx(Select, {
+          "aria-label": "Transport",
+          className: "w-[160px]",
+          disabled: disabled2,
+          onValueChange: (value) => updateDraft((current) => ({
+            ...current,
+            transport: value
+          })),
+          options: [...TRANSPORT_OPTIONS],
+          value: draft?.transport ?? "auto"
+        })
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Steering",
+        subtitle: "How queued steers are delivered mid-turn",
+        trailing: /* @__PURE__ */ jsx(Select, {
+          "aria-label": "Steering",
+          className: "w-[160px]",
+          disabled: disabled2,
+          onValueChange: (value) => updateDraft((current) => ({
+            ...current,
+            steeringMode: value
+          })),
+          options: [...DELIVERY_OPTIONS],
+          value: draft?.steeringMode ?? "all"
+        })
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Follow-up",
+        subtitle: "How queued follow-ups run after the turn",
+        trailing: /* @__PURE__ */ jsx(Select, {
+          "aria-label": "Follow-up",
+          className: "w-[160px]",
+          disabled: disabled2,
+          onValueChange: (value) => updateDraft((current) => ({
+            ...current,
+            followUpMode: value
+          })),
+          options: [...DELIVERY_OPTIONS],
+          value: draft?.followUpMode ?? "all"
+        })
+      })
+    ]
+  });
+}
 function ResourcesSection({ draft, onEnableSkillCommandsChange, onExtensionsChange, onPackageRowsChange, onPromptsChange, onRevert, onSave, onSkillsChange, onThemesChange, packageError, packageRows, resourceDirty, resources, resourceSummary, saving, scope = "harness", settingsLoading, updateDraft }) {
   const disabled2 = !draft || settingsLoading || !!packageError;
   const catalogSubtitle = resourceSummary.total === 0 ? "Empty" : resourceSummary.reloadRequired > 0 ? `${resourceSummary.total} \xB7 ${resourceSummary.reloadRequired} reload` : `${resourceSummary.total}`;