@qredence/fleet 0.7.2 → 0.7.3

package/dist/web/server/settings-dialog-Drq872Y0-MCZGTE2Q.js

@@ -0,0 +1,4650 @@
+import {
+  Spinner
+} from "./chunk-X76RBZ37.js";
+import {
+  InputGroup,
+  InputGroupAddon,
+  InputGroupButton,
+  InputGroupInput,
+  Textarea
+} from "./chunk-A4G5TLBT.js";
+import {
+  Alert,
+  AlertDescription,
+  Field,
+  FieldDescription,
+  FieldGroup,
+  FieldLabel,
+  Switch$1
+} from "./chunk-RNDLTVTD.js";
+import {
+  isModelPatternEnabled,
+  modelMatchesPattern,
+  modelPattern
+} from "./chunk-WTYNN6EV.js";
+import {
+  AlertDialog$1,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogTitle,
+  Dialog$1,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+  Input$1,
+  PROVIDER_METADATA,
+  ProviderBrandIcon,
+  Select$1,
+  formatProviderLabel,
+  normalizeScrollOffset,
+  notify,
+  styleDisableScrollbar,
+  useBaseUiId,
+  useCSPContext,
+  useChatPanelDataContext,
+  useSettingsActionsContext
+} from "./chunk-CBHKOBJJ.js";
+import {
+  Button$1,
+  addEventListener,
+  applyUiPreferencesToDocument,
+  clamp,
+  contains,
+  formatErrorMessage_default,
+  getTarget,
+  isCustomProviderId,
+  isNamedOccInstanceId,
+  isOccProviderId,
+  parts_exports,
+  readUiPreferences,
+  useDirection,
+  useIsoLayoutEffect,
+  useRenderElement,
+  useShape,
+  useStableCallback,
+  useTimeout,
+  writeUiPreferences
+} from "./chunk-FFGFTGLQ.js";
+import {
+  COMPACT_ACTION_BUTTON_CLASS,
+  HIT_AREA_EXPAND_CLASS,
+  HIT_AREA_EXPAND_DENSE_CLASS,
+  rowSurface
+} from "./chunk-GDPICT5Q.js";
+import "./chunk-FB3UHLLN.js";
+import {
+  ArrowLeft,
+  Box,
+  Check,
+  ChevronRight,
+  Cpu,
+  ExternalLink,
+  Eye,
+  EyeOff,
+  Globe,
+  HardDrive,
+  Info,
+  KeyRound,
+  Keyboard,
+  Layers,
+  LoaderCircle,
+  Lock,
+  MessageSquare,
+  Monitor,
+  Moon,
+  Paintbrush,
+  Pencil,
+  Plug,
+  Plus,
+  RefreshCw,
+  RotateCcw,
+  Save,
+  Search,
+  Settings,
+  Sparkles,
+  Star,
+  Sun,
+  Tag,
+  Trash,
+  Users
+} from "./chunk-777VIBCH.js";
+import "./chunk-OO7NBFQQ.js";
+import {
+  cn
+} from "./chunk-TMQ3MT3D.js";
+import "./chunk-LECHJX4M.js";
+import "./chunk-WPSI5TBE.js";
+import "./chunk-NXAVRSI5.js";
+import {
+  __export
+} from "./chunk-CZ7CSFO4.js";
+
+// web/app/dist/server/assets/settings-dialog-Drq872Y0.js
+import { createContext as createContext4, forwardRef as forwardRef7, useCallback, useContext as useContext4, useEffect as useEffect2, useId, useMemo as useMemo3, useRef as useRef4, useState as useState2 } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/index.parts.mjs
+var index_parts_exports = {};
+__export(index_parts_exports, {
+  Content: () => ScrollAreaContent,
+  Corner: () => ScrollAreaCorner,
+  Root: () => ScrollAreaRoot,
+  Scrollbar: () => ScrollAreaScrollbar,
+  Thumb: () => ScrollAreaThumb,
+  Viewport: () => ScrollAreaViewport
+});
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/root/ScrollAreaRoot.mjs
+import * as React2 from "react";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/root/ScrollAreaRootContext.mjs
+import * as React from "react";
+var ScrollAreaRootContext = /* @__PURE__ */ React.createContext(void 0);
+if (process.env.NODE_ENV !== "production") ScrollAreaRootContext.displayName = "ScrollAreaRootContext";
+function useScrollAreaRootContext() {
+  const context = React.useContext(ScrollAreaRootContext);
+  if (context === void 0) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ScrollAreaRootContext is missing. ScrollArea parts must be placed within <ScrollArea.Root>." : formatErrorMessage_default(53));
+  }
+  return context;
+}
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/constants.mjs
+var SCROLL_TIMEOUT = 500;
+var MIN_THUMB_SIZE = 16;
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/utils/getOffset.mjs
+function getOffset(element, prop, axis) {
+  if (!element) {
+    return 0;
+  }
+  const styles = getComputedStyle(element);
+  const key = `${prop}${axis === "x" ? "Inline" : "Block"}`;
+  const start = parseFloat(styles[`${key}Start`]);
+  if (axis === "x" && prop === "margin") {
+    return start * 2;
+  }
+  return start + parseFloat(styles[`${key}End`]);
+}
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/root/ScrollAreaRootDataAttributes.mjs
+var hasOverflowX = "data-has-overflow-x";
+var hasOverflowY = "data-has-overflow-y";
+var overflowXStart = "data-overflow-x-start";
+var overflowXEnd = "data-overflow-x-end";
+var overflowYStart = "data-overflow-y-start";
+var overflowYEnd = "data-overflow-y-end";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/root/stateAttributes.mjs
+var attr = (name) => (value) => value ? {
+  [name]: ""
+} : null;
+var scrollAreaStateAttributesMapping = {
+  hasOverflowX: attr(hasOverflowX),
+  hasOverflowY: attr(hasOverflowY),
+  overflowXStart: attr(overflowXStart),
+  overflowXEnd: attr(overflowXEnd),
+  overflowYStart: attr(overflowYStart),
+  overflowYEnd: attr(overflowYEnd),
+  cornerHidden: () => null
+};
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/root/ScrollAreaRootCssVars.mjs
+var scrollAreaCornerHeight = "--scroll-area-corner-height";
+var scrollAreaCornerWidth = "--scroll-area-corner-width";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/scrollbar/ScrollAreaScrollbarDataAttributes.mjs
+var orientation = "data-orientation";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/root/ScrollAreaRoot.mjs
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var DEFAULT_COORDS = {
+  x: 0,
+  y: 0
+};
+var DEFAULT_SIZE = {
+  width: 0,
+  height: 0
+};
+var DEFAULT_OVERFLOW_EDGES = {
+  xStart: false,
+  xEnd: false,
+  yStart: false,
+  yEnd: false
+};
+var DEFAULT_HIDDEN_STATE = {
+  x: true,
+  y: true,
+  corner: true
+};
+var ScrollAreaRoot = /* @__PURE__ */ React2.forwardRef(function ScrollAreaRoot2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    overflowEdgeThreshold: overflowEdgeThresholdProp,
+    style,
+    ...elementProps
+  } = componentProps;
+  const {
+    xStart,
+    xEnd,
+    yStart,
+    yEnd
+  } = normalizeOverflowEdgeThreshold(overflowEdgeThresholdProp);
+  const rootId = useBaseUiId();
+  const scrollYTimeout = useTimeout();
+  const scrollXTimeout = useTimeout();
+  const {
+    nonce,
+    disableStyleElements
+  } = useCSPContext();
+  const [hovering, setHovering] = React2.useState(false);
+  const [scrollingX, setScrollingX] = React2.useState(false);
+  const [scrollingY, setScrollingY] = React2.useState(false);
+  const [touchModality, setTouchModality] = React2.useState(false);
+  const [hasMeasuredScrollbar, setHasMeasuredScrollbar] = React2.useState(false);
+  const [cornerSize, setCornerSize] = React2.useState(DEFAULT_SIZE);
+  const [thumbSize, setThumbSize] = React2.useState(DEFAULT_SIZE);
+  const [overflowEdges, setOverflowEdges] = React2.useState(DEFAULT_OVERFLOW_EDGES);
+  const [hiddenState, setHiddenState] = React2.useState(DEFAULT_HIDDEN_STATE);
+  const rootRef = React2.useRef(null);
+  const viewportRef = React2.useRef(null);
+  const scrollbarYRef = React2.useRef(null);
+  const scrollbarXRef = React2.useRef(null);
+  const thumbYRef = React2.useRef(null);
+  const thumbXRef = React2.useRef(null);
+  const cornerRef = React2.useRef(null);
+  const activePointerIdRef = React2.useRef(null);
+  const startYRef = React2.useRef(0);
+  const startXRef = React2.useRef(0);
+  const startScrollTopRef = React2.useRef(0);
+  const startScrollLeftRef = React2.useRef(0);
+  const currentOrientationRef = React2.useRef("vertical");
+  const scrollPositionRef = React2.useRef(DEFAULT_COORDS);
+  const savedSnapTypeRef = React2.useRef(null);
+  function startScrolling(vertical) {
+    const setScrolling = vertical ? setScrollingY : setScrollingX;
+    const timeout = vertical ? scrollYTimeout : scrollXTimeout;
+    setScrolling(true);
+    timeout.start(SCROLL_TIMEOUT, () => {
+      setScrolling(false);
+    });
+  }
+  const handleScroll = useStableCallback((scrollPosition) => {
+    const offsetX = scrollPosition.x - scrollPositionRef.current.x;
+    const offsetY = scrollPosition.y - scrollPositionRef.current.y;
+    scrollPositionRef.current = scrollPosition;
+    if (offsetY !== 0) {
+      startScrolling(true);
+    }
+    if (offsetX !== 0) {
+      startScrolling(false);
+    }
+  });
+  const disableViewportSnap = useStableCallback(() => {
+    const viewportEl = viewportRef.current;
+    if (viewportEl && savedSnapTypeRef.current === null) {
+      savedSnapTypeRef.current = viewportEl.style.scrollSnapType;
+      viewportEl.style.scrollSnapType = "none";
+    }
+  });
+  const handlePointerDown = useStableCallback((event) => {
+    if (event.button !== 0) {
+      return;
+    }
+    if (activePointerIdRef.current !== null) {
+      const activeThumb = currentOrientationRef.current === "vertical" ? thumbYRef.current : thumbXRef.current;
+      if (activeThumb?.hasPointerCapture(activePointerIdRef.current)) {
+        return;
+      }
+    }
+    activePointerIdRef.current = event.pointerId;
+    startYRef.current = event.clientY;
+    startXRef.current = event.clientX;
+    currentOrientationRef.current = event.currentTarget.getAttribute(orientation);
+    const viewportEl = viewportRef.current;
+    if (viewportEl) {
+      startScrollTopRef.current = viewportEl.scrollTop;
+      startScrollLeftRef.current = viewportEl.scrollLeft;
+      disableViewportSnap();
+    }
+    const thumb = currentOrientationRef.current === "vertical" ? thumbYRef.current : thumbXRef.current;
+    thumb?.setPointerCapture(event.pointerId);
+  });
+  const handlePointerUp = useStableCallback((event) => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
+    }
+    activePointerIdRef.current = null;
+    (currentOrientationRef.current === "vertical" ? setScrollingY : setScrollingX)(false);
+    if (savedSnapTypeRef.current !== null) {
+      if (viewportRef.current) {
+        viewportRef.current.style.scrollSnapType = savedSnapTypeRef.current;
+      }
+      savedSnapTypeRef.current = null;
+    }
+    const thumb = currentOrientationRef.current === "vertical" ? thumbYRef.current : thumbXRef.current;
+    if (thumb?.hasPointerCapture(event.pointerId)) {
+      thumb.releasePointerCapture(event.pointerId);
+    }
+  });
+  const handlePointerMove = useStableCallback((event) => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
+    }
+    if (event.buttons % 2 === 0) {
+      handlePointerUp(event);
+      return;
+    }
+    const viewportEl = viewportRef.current;
+    if (!viewportEl) {
+      return;
+    }
+    const vertical = currentOrientationRef.current === "vertical";
+    const thumbEl = vertical ? thumbYRef.current : thumbXRef.current;
+    const scrollbarEl = vertical ? scrollbarYRef.current : scrollbarXRef.current;
+    if (!thumbEl || !scrollbarEl) {
+      return;
+    }
+    const axis = vertical ? "y" : "x";
+    const scrollbarOffset = getOffset(scrollbarEl, "padding", axis);
+    const thumbOffset = getOffset(thumbEl, "margin", axis);
+    const thumbSizePx = vertical ? thumbEl.offsetHeight : thumbEl.offsetWidth;
+    const trackSize = vertical ? scrollbarEl.offsetHeight : scrollbarEl.offsetWidth;
+    const maxThumbOffset = trackSize - thumbSizePx - scrollbarOffset - thumbOffset;
+    const delta = vertical ? event.clientY - startYRef.current : event.clientX - startXRef.current;
+    const scrollRatio = maxThumbOffset <= 0 ? 0 : delta / maxThumbOffset;
+    const scrollableSize = vertical ? viewportEl.scrollHeight : viewportEl.scrollWidth;
+    const viewportSize = vertical ? viewportEl.clientHeight : viewportEl.clientWidth;
+    const startScroll = vertical ? startScrollTopRef.current : startScrollLeftRef.current;
+    const nextScroll = startScroll + scrollRatio * (scrollableSize - viewportSize);
+    if (vertical) {
+      viewportEl.scrollTop = nextScroll;
+    } else {
+      viewportEl.scrollLeft = nextScroll;
+    }
+    event.preventDefault();
+    startScrolling(vertical);
+  });
+  function handleTouchModalityChange(event) {
+    setTouchModality(event.pointerType === "touch");
+  }
+  function handlePointerEnterOrMove(event) {
+    handleTouchModalityChange(event);
+    if (event.pointerType !== "touch") {
+      const isTargetRootChild = contains(rootRef.current, event.target);
+      setHovering(isTargetRootChild);
+    }
+  }
+  const state = React2.useMemo(() => ({
+    scrolling: scrollingX || scrollingY,
+    hasOverflowX: !hiddenState.x,
+    hasOverflowY: !hiddenState.y,
+    overflowXStart: overflowEdges.xStart,
+    overflowXEnd: overflowEdges.xEnd,
+    overflowYStart: overflowEdges.yStart,
+    overflowYEnd: overflowEdges.yEnd,
+    cornerHidden: hiddenState.corner
+  }), [scrollingX, scrollingY, hiddenState.x, hiddenState.y, hiddenState.corner, overflowEdges]);
+  const props = {
+    role: "presentation",
+    onPointerEnter: handlePointerEnterOrMove,
+    onPointerMove: handlePointerEnterOrMove,
+    onPointerDown: handleTouchModalityChange,
+    onPointerLeave() {
+      setHovering(false);
+    },
+    style: {
+      position: "relative",
+      [scrollAreaCornerHeight]: `${cornerSize.height}px`,
+      [scrollAreaCornerWidth]: `${cornerSize.width}px`
+    }
+  };
+  const element = useRenderElement("div", componentProps, {
+    state,
+    ref: [forwardedRef, rootRef],
+    props: [props, elementProps],
+    stateAttributesMapping: scrollAreaStateAttributesMapping
+  });
+  const contextValue = React2.useMemo(() => ({
+    handlePointerDown,
+    handlePointerMove,
+    handlePointerUp,
+    handleScroll,
+    disableViewportSnap,
+    cornerSize,
+    setCornerSize,
+    thumbSize,
+    setThumbSize,
+    hasMeasuredScrollbar,
+    setHasMeasuredScrollbar,
+    touchModality,
+    cornerRef,
+    scrollingX,
+    scrollingY,
+    hovering,
+    setHovering,
+    viewportRef,
+    scrollbarYRef,
+    scrollbarXRef,
+    thumbYRef,
+    thumbXRef,
+    rootId,
+    hiddenState,
+    setHiddenState,
+    overflowEdges,
+    setOverflowEdges,
+    viewportState: state,
+    overflowEdgeThreshold: {
+      xStart,
+      xEnd,
+      yStart,
+      yEnd
+    }
+  }), [handlePointerDown, handlePointerMove, handlePointerUp, handleScroll, disableViewportSnap, cornerSize, thumbSize, hasMeasuredScrollbar, touchModality, scrollingX, scrollingY, hovering, rootId, hiddenState, overflowEdges, state, xStart, xEnd, yStart, yEnd]);
+  return /* @__PURE__ */ _jsxs(ScrollAreaRootContext.Provider, {
+    value: contextValue,
+    children: [!disableStyleElements && styleDisableScrollbar.getElement(nonce), element]
+  });
+});
+if (process.env.NODE_ENV !== "production") ScrollAreaRoot.displayName = "ScrollAreaRoot";
+function normalizeOverflowEdgeThreshold(threshold) {
+  const thresholds = typeof threshold === "number" ? {
+    xStart: threshold,
+    xEnd: threshold,
+    yStart: threshold,
+    yEnd: threshold
+  } : threshold;
+  return {
+    xStart: Math.max(0, thresholds?.xStart || 0),
+    xEnd: Math.max(0, thresholds?.xEnd || 0),
+    yStart: Math.max(0, thresholds?.yStart || 0),
+    yEnd: Math.max(0, thresholds?.yEnd || 0)
+  };
+}
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/viewport/ScrollAreaViewport.mjs
+import * as React4 from "react";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/viewport/ScrollAreaViewportContext.mjs
+import * as React3 from "react";
+var ScrollAreaViewportContext = /* @__PURE__ */ React3.createContext(void 0);
+if (process.env.NODE_ENV !== "production") ScrollAreaViewportContext.displayName = "ScrollAreaViewportContext";
+function useScrollAreaViewportContext() {
+  const context = React3.useContext(ScrollAreaViewportContext);
+  if (context === void 0) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ScrollAreaViewportContext missing. ScrollAreaViewport parts must be placed within <ScrollArea.Viewport>." : formatErrorMessage_default(55));
+  }
+  return context;
+}
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/viewport/ScrollAreaViewportCssVars.mjs
+var scrollAreaOverflowXStart = "--scroll-area-overflow-x-start";
+var scrollAreaOverflowXEnd = "--scroll-area-overflow-x-end";
+var scrollAreaOverflowYStart = "--scroll-area-overflow-y-start";
+var scrollAreaOverflowYEnd = "--scroll-area-overflow-y-end";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/scrollbar/ScrollAreaScrollbarCssVars.mjs
+var scrollAreaThumbHeight = "--scroll-area-thumb-height";
+var scrollAreaThumbWidth = "--scroll-area-thumb-width";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/viewport/ScrollAreaViewport.mjs
+import { jsx as _jsx } from "react/jsx-runtime";
+var OVERFLOW_EDGE_VARS = [scrollAreaOverflowXStart, scrollAreaOverflowXEnd, scrollAreaOverflowYStart, scrollAreaOverflowYEnd];
+var scrollAreaOverflowVarsRegistered = false;
+function removeCSSVariableInheritance() {
+  if (scrollAreaOverflowVarsRegistered || // When `inherits: false`, specifying `inherit` on child elements doesn't work
+  // in Safari. To let CSS features work correctly, this optimization must be skipped.
+  parts_exports.engine.webkit) {
+    return;
+  }
+  if (typeof CSS !== "undefined" && "registerProperty" in CSS) {
+    OVERFLOW_EDGE_VARS.forEach((name) => {
+      try {
+        CSS.registerProperty({
+          name,
+          syntax: "<length>",
+          inherits: false,
+          initialValue: "0px"
+        });
+      } catch {
+      }
+    });
+  }
+  scrollAreaOverflowVarsRegistered = true;
+}
+var ScrollAreaViewport = /* @__PURE__ */ React4.forwardRef(function ScrollAreaViewport2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    style,
+    ...elementProps
+  } = componentProps;
+  const {
+    viewportRef,
+    scrollbarYRef,
+    scrollbarXRef,
+    thumbYRef,
+    thumbXRef,
+    cornerRef,
+    cornerSize,
+    setCornerSize,
+    setThumbSize,
+    rootId,
+    setHiddenState,
+    hiddenState,
+    setHasMeasuredScrollbar,
+    handleScroll,
+    touchModality,
+    setHovering,
+    setOverflowEdges,
+    overflowEdgeThreshold,
+    viewportState
+  } = useScrollAreaRootContext();
+  const direction = useDirection();
+  const programmaticScrollRef = React4.useRef(true);
+  const lastMeasuredViewportMetricsRef = React4.useRef([NaN, NaN, NaN, NaN]);
+  const scrollEndTimeout = useTimeout();
+  const waitForAnimationsTimeout = useTimeout();
+  const computeThumbPosition = useStableCallback(() => {
+    const viewportEl = viewportRef.current;
+    const scrollbarYEl = scrollbarYRef.current;
+    const scrollbarXEl = scrollbarXRef.current;
+    const thumbYEl = thumbYRef.current;
+    const thumbXEl = thumbXRef.current;
+    const cornerEl = cornerRef.current;
+    if (!viewportEl) {
+      return;
+    }
+    const scrollableContentHeight = viewportEl.scrollHeight;
+    const scrollableContentWidth = viewportEl.scrollWidth;
+    const viewportHeight = viewportEl.clientHeight;
+    const viewportWidth = viewportEl.clientWidth;
+    const scrollTop = viewportEl.scrollTop;
+    const scrollLeft = viewportEl.scrollLeft;
+    const lastMeasuredViewportMetrics = lastMeasuredViewportMetricsRef.current;
+    const isFirstMeasurement = Number.isNaN(lastMeasuredViewportMetrics[0]);
+    lastMeasuredViewportMetrics[0] = viewportHeight;
+    lastMeasuredViewportMetrics[1] = scrollableContentHeight;
+    lastMeasuredViewportMetrics[2] = viewportWidth;
+    lastMeasuredViewportMetrics[3] = scrollableContentWidth;
+    if (isFirstMeasurement) {
+      setHasMeasuredScrollbar(true);
+    }
+    if (scrollableContentHeight === 0 || scrollableContentWidth === 0) {
+      return;
+    }
+    const nextHiddenState = getHiddenState(viewportEl);
+    const scrollbarYHidden = nextHiddenState.y;
+    const scrollbarXHidden = nextHiddenState.x;
+    const ratioX = viewportWidth / scrollableContentWidth;
+    const ratioY = viewportHeight / scrollableContentHeight;
+    const maxScrollLeft = Math.max(0, scrollableContentWidth - viewportWidth);
+    const maxScrollTop = Math.max(0, scrollableContentHeight - viewportHeight);
+    let scrollLeftFromStart = 0;
+    let scrollLeftFromEnd = 0;
+    if (!scrollbarXHidden) {
+      scrollLeftFromStart = normalizeScrollOffset(direction === "rtl" ? -scrollLeft : scrollLeft, maxScrollLeft);
+      scrollLeftFromEnd = maxScrollLeft - scrollLeftFromStart;
+    }
+    const scrollTopFromStart = scrollbarYHidden ? 0 : normalizeScrollOffset(scrollTop, maxScrollTop);
+    const scrollTopFromEnd = scrollbarYHidden ? 0 : maxScrollTop - scrollTopFromStart;
+    const nextWidth = scrollbarXHidden ? 0 : viewportWidth;
+    const nextHeight = scrollbarYHidden ? 0 : viewportHeight;
+    let nextCornerWidth = 0;
+    let nextCornerHeight = 0;
+    if (!scrollbarXHidden && !scrollbarYHidden) {
+      nextCornerWidth = scrollbarYEl?.offsetWidth || 0;
+      nextCornerHeight = scrollbarXEl?.offsetHeight || 0;
+    }
+    const cornerNotYetSized = cornerSize.width === 0 && cornerSize.height === 0;
+    const cornerWidthOffset = cornerNotYetSized ? nextCornerWidth : 0;
+    const cornerHeightOffset = cornerNotYetSized ? nextCornerHeight : 0;
+    const scrollbarXOffset = getOffset(scrollbarXEl, "padding", "x");
+    const scrollbarYOffset = getOffset(scrollbarYEl, "padding", "y");
+    const thumbXOffset = getOffset(thumbXEl, "margin", "x");
+    const thumbYOffset = getOffset(thumbYEl, "margin", "y");
+    const idealNextWidth = nextWidth - scrollbarXOffset - thumbXOffset;
+    const idealNextHeight = nextHeight - scrollbarYOffset - thumbYOffset;
+    const maxNextWidth = scrollbarXEl ? Math.min(scrollbarXEl.offsetWidth - cornerWidthOffset, idealNextWidth) : idealNextWidth;
+    const maxNextHeight = scrollbarYEl ? Math.min(scrollbarYEl.offsetHeight - cornerHeightOffset, idealNextHeight) : idealNextHeight;
+    const clampedNextWidth = Math.max(MIN_THUMB_SIZE, maxNextWidth * ratioX);
+    const clampedNextHeight = Math.max(MIN_THUMB_SIZE, maxNextHeight * ratioY);
+    setThumbSize((prevSize) => pickState(prevSize, {
+      width: clampedNextWidth,
+      height: clampedNextHeight
+    }));
+    if (scrollbarYEl && thumbYEl) {
+      const maxThumbOffsetY = scrollbarYEl.offsetHeight - clampedNextHeight - scrollbarYOffset - thumbYOffset;
+      const thumbOffsetY = applyOverscrollThumb(thumbYEl, scrollAreaThumbHeight, scrollTop, maxScrollTop, scrollableContentHeight, clampedNextHeight, maxThumbOffsetY);
+      thumbYEl.style.transform = `translate3d(0,${thumbOffsetY}px,0)`;
+    }
+    if (scrollbarXEl && thumbXEl) {
+      const maxThumbOffsetX = scrollbarXEl.offsetWidth - clampedNextWidth - scrollbarXOffset - thumbXOffset;
+      const scrollFromStart = direction === "rtl" ? -scrollLeft : scrollLeft;
+      const offsetX = applyOverscrollThumb(thumbXEl, scrollAreaThumbWidth, scrollFromStart, maxScrollLeft, scrollableContentWidth, clampedNextWidth, maxThumbOffsetX);
+      thumbXEl.style.transform = `translate3d(${direction === "rtl" ? -offsetX : offsetX}px,0,0)`;
+    }
+    const overflowMetricsPx = [scrollLeftFromStart, scrollLeftFromEnd, scrollTopFromStart, scrollTopFromEnd];
+    OVERFLOW_EDGE_VARS.forEach((cssVar, index) => {
+      viewportEl.style.setProperty(cssVar, `${overflowMetricsPx[index]}px`);
+    });
+    if (cornerEl) {
+      setCornerSize((prevSize) => pickState(prevSize, {
+        width: nextCornerWidth,
+        height: nextCornerHeight
+      }));
+    }
+    setHiddenState((prevState) => pickState(prevState, nextHiddenState));
+    const nextOverflowEdges = {
+      xStart: !scrollbarXHidden && scrollLeftFromStart > overflowEdgeThreshold.xStart,
+      xEnd: !scrollbarXHidden && scrollLeftFromEnd > overflowEdgeThreshold.xEnd,
+      yStart: !scrollbarYHidden && scrollTopFromStart > overflowEdgeThreshold.yStart,
+      yEnd: !scrollbarYHidden && scrollTopFromEnd > overflowEdgeThreshold.yEnd
+    };
+    setOverflowEdges((prev) => pickState(prev, nextOverflowEdges));
+  });
+  useIsoLayoutEffect(() => {
+    removeCSSVariableInheritance();
+  }, []);
+  useIsoLayoutEffect(() => {
+    queueMicrotask(computeThumbPosition);
+  }, [computeThumbPosition, hiddenState, direction, overflowEdgeThreshold.xStart, overflowEdgeThreshold.xEnd, overflowEdgeThreshold.yStart, overflowEdgeThreshold.yEnd]);
+  useIsoLayoutEffect(() => {
+    if (viewportRef.current?.matches(":hover")) {
+      setHovering(true);
+    }
+  }, [viewportRef, setHovering]);
+  useIsoLayoutEffect(() => {
+    const viewport = viewportRef.current;
+    if (typeof ResizeObserver === "undefined" || !viewport) {
+      return void 0;
+    }
+    let hasInitialized = false;
+    const resizeObserver = new ResizeObserver(() => {
+      if (!hasInitialized) {
+        hasInitialized = true;
+        const lastMeasuredViewportMetrics = lastMeasuredViewportMetricsRef.current;
+        if (lastMeasuredViewportMetrics[0] === viewport.clientHeight && lastMeasuredViewportMetrics[1] === viewport.scrollHeight && lastMeasuredViewportMetrics[2] === viewport.clientWidth && lastMeasuredViewportMetrics[3] === viewport.scrollWidth) {
+          return;
+        }
+      }
+      computeThumbPosition();
+    });
+    resizeObserver.observe(viewport);
+    waitForAnimationsTimeout.start(0, () => {
+      const animations = viewport.getAnimations({
+        subtree: true
+      });
+      if (animations.length === 0) {
+        return;
+      }
+      Promise.allSettled(animations.map((animation) => animation.finished)).then(computeThumbPosition).catch(() => {
+      });
+    });
+    return () => {
+      resizeObserver.disconnect();
+      waitForAnimationsTimeout.clear();
+    };
+  }, [computeThumbPosition, viewportRef, waitForAnimationsTimeout]);
+  function handleUserInteraction() {
+    programmaticScrollRef.current = false;
+  }
+  const props = {
+    role: "presentation",
+    ...rootId && {
+      "data-id": `${rootId}-viewport`
+    },
+    // https://accessibilityinsights.io/info-examples/web/scrollable-region-focusable/
+    // Keep non-scrollable viewports out of tab order.
+    tabIndex: hiddenState.x && hiddenState.y ? -1 : 0,
+    className: styleDisableScrollbar.className,
+    style: {
+      overflow: "scroll"
+    },
+    onScroll() {
+      if (!viewportRef.current) {
+        return;
+      }
+      computeThumbPosition();
+      if (touchModality || !programmaticScrollRef.current) {
+        handleScroll({
+          x: viewportRef.current.scrollLeft,
+          y: viewportRef.current.scrollTop
+        });
+      }
+      scrollEndTimeout.start(100, () => {
+        programmaticScrollRef.current = true;
+      });
+    },
+    onWheel: handleUserInteraction,
+    onPointerMove: handleUserInteraction,
+    onPointerEnter: handleUserInteraction,
+    onKeyDown: handleUserInteraction
+  };
+  const element = useRenderElement("div", componentProps, {
+    ref: [forwardedRef, viewportRef],
+    state: viewportState,
+    props: [props, elementProps],
+    stateAttributesMapping: scrollAreaStateAttributesMapping
+  });
+  const contextValue = React4.useMemo(() => ({
+    computeThumbPosition
+  }), [computeThumbPosition]);
+  return /* @__PURE__ */ _jsx(ScrollAreaViewportContext.Provider, {
+    value: contextValue,
+    children: element
+  });
+});
+if (process.env.NODE_ENV !== "production") ScrollAreaViewport.displayName = "ScrollAreaViewport";
+function getHiddenState(viewport) {
+  const y = viewport.clientHeight >= viewport.scrollHeight;
+  const x = viewport.clientWidth >= viewport.scrollWidth;
+  return {
+    y,
+    x,
+    corner: y || x
+  };
+}
+function pickState(prev, next) {
+  for (const key in next) {
+    if (prev[key] !== next[key]) {
+      return next;
+    }
+  }
+  return prev;
+}
+function applyOverscrollThumb(thumbEl, sizeVar, scrollFromStart, maxScroll, content, size, maxThumbOffset) {
+  const clamped = clamp(scrollFromStart, 0, maxScroll);
+  const overscroll = scrollFromStart - clamped;
+  const nextSize = Math.max(MIN_THUMB_SIZE, size * content / (content + Math.abs(overscroll)));
+  thumbEl.style.setProperty(sizeVar, overscroll ? `${nextSize}px` : "");
+  const offset = maxScroll ? clamped / maxScroll * maxThumbOffset : 0;
+  return offset + (overscroll > 0 ? size - nextSize : 0);
+}
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/scrollbar/ScrollAreaScrollbar.mjs
+import * as React6 from "react";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/scrollbar/ScrollAreaScrollbarContext.mjs
+import * as React5 from "react";
+var ScrollAreaScrollbarContext = /* @__PURE__ */ React5.createContext(void 0);
+if (process.env.NODE_ENV !== "production") ScrollAreaScrollbarContext.displayName = "ScrollAreaScrollbarContext";
+function useScrollAreaScrollbarContext() {
+  const context = React5.useContext(ScrollAreaScrollbarContext);
+  if (context === void 0) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: ScrollAreaScrollbarContext is missing. ScrollAreaScrollbar parts must be placed within <ScrollArea.Scrollbar>." : formatErrorMessage_default(54));
+  }
+  return context;
+}
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/scrollbar/ScrollAreaScrollbar.mjs
+import { jsx as _jsx2 } from "react/jsx-runtime";
+var ScrollAreaScrollbar = /* @__PURE__ */ React6.forwardRef(function ScrollAreaScrollbar2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    orientation: orientation2 = "vertical",
+    keepMounted = false,
+    style,
+    ...elementProps
+  } = componentProps;
+  const {
+    hovering,
+    scrollingX,
+    scrollingY,
+    hiddenState,
+    scrollbarYRef,
+    scrollbarXRef,
+    viewportRef,
+    thumbYRef,
+    thumbXRef,
+    handlePointerDown,
+    handlePointerUp,
+    handleScroll,
+    disableViewportSnap,
+    rootId,
+    thumbSize,
+    hasMeasuredScrollbar,
+    viewportState
+  } = useScrollAreaRootContext();
+  const vertical = orientation2 === "vertical";
+  const state = {
+    ...viewportState,
+    hovering,
+    scrolling: vertical ? scrollingY : scrollingX,
+    orientation: orientation2
+  };
+  const direction = useDirection();
+  const hideTrackUntilMeasured = !hasMeasuredScrollbar && !keepMounted;
+  const isHidden = vertical ? hiddenState.y : hiddenState.x;
+  const shouldRender = keepMounted || !isHidden;
+  React6.useEffect(() => {
+    if (!shouldRender) {
+      return void 0;
+    }
+    const viewportEl = viewportRef.current;
+    const scrollbarEl = vertical ? scrollbarYRef.current : scrollbarXRef.current;
+    if (!scrollbarEl) {
+      return void 0;
+    }
+    function handleWheel(event) {
+      if (!viewportEl || event.ctrlKey) {
+        return;
+      }
+      const horizontal = !vertical;
+      const scrollProperty = horizontal ? "scrollLeft" : "scrollTop";
+      const delta = horizontal ? event.deltaX : event.deltaY;
+      if (delta === 0) {
+        return;
+      }
+      const maxScroll = horizontal ? viewportEl.scrollWidth - viewportEl.clientWidth : viewportEl.scrollHeight - viewportEl.clientHeight;
+      const minScroll = horizontal && direction === "rtl" ? -maxScroll : 0;
+      const maxScrollValue = horizontal && direction === "rtl" ? 0 : maxScroll;
+      const scrollValue = viewportEl[scrollProperty];
+      if (scrollValue <= minScroll && delta < 0 || scrollValue >= maxScrollValue && delta > 0) {
+        return;
+      }
+      event.preventDefault();
+      viewportEl[scrollProperty] = Math.min(maxScrollValue, Math.max(minScroll, scrollValue + delta));
+      handleScroll({
+        x: viewportEl.scrollLeft,
+        y: viewportEl.scrollTop
+      });
+    }
+    return addEventListener(scrollbarEl, "wheel", handleWheel, {
+      passive: false
+    });
+  }, [direction, handleScroll, vertical, scrollbarXRef, scrollbarYRef, shouldRender, viewportRef]);
+  const props = {
+    ...rootId && {
+      "data-id": `${rootId}-scrollbar`
+    },
+    "aria-hidden": true,
+    onPointerDown(event) {
+      if (event.button !== 0) {
+        return;
+      }
+      const target = getTarget(event.nativeEvent);
+      const thumbEl = vertical ? thumbYRef.current : thumbXRef.current;
+      if (thumbEl && contains(thumbEl, target)) {
+        return;
+      }
+      const viewportEl = viewportRef.current;
+      if (!viewportEl) {
+        return;
+      }
+      const scrollbarEl = vertical ? scrollbarYRef.current : scrollbarXRef.current;
+      if (!thumbEl || !scrollbarEl) {
+        return;
+      }
+      const axis = vertical ? "y" : "x";
+      const thumbOffset = getOffset(thumbEl, "margin", axis);
+      const scrollbarOffset = getOffset(scrollbarEl, "padding", axis);
+      const thumbSizePx = vertical ? thumbEl.offsetHeight : thumbEl.offsetWidth;
+      const trackRect = scrollbarEl.getBoundingClientRect();
+      const clickPosition = vertical ? event.clientY - trackRect.top - thumbSizePx / 2 - scrollbarOffset + thumbOffset / 2 : event.clientX - trackRect.left - thumbSizePx / 2 - scrollbarOffset + thumbOffset / 2;
+      const scrollableSize = vertical ? viewportEl.scrollHeight : viewportEl.scrollWidth;
+      const viewportSize = vertical ? viewportEl.clientHeight : viewportEl.clientWidth;
+      const trackSize = vertical ? scrollbarEl.offsetHeight : scrollbarEl.offsetWidth;
+      const maxThumbOffset = trackSize - thumbSizePx - scrollbarOffset - thumbOffset;
+      if (maxThumbOffset <= 0) {
+        return;
+      }
+      const scrollRatio = clickPosition / maxThumbOffset;
+      const maxScrollDistance = scrollableSize - viewportSize;
+      disableViewportSnap();
+      if (vertical) {
+        viewportEl.scrollTop = scrollRatio * maxScrollDistance;
+      } else if (direction === "rtl") {
+        viewportEl.scrollLeft = -(1 - scrollRatio) * maxScrollDistance;
+      } else {
+        viewportEl.scrollLeft = scrollRatio * maxScrollDistance;
+      }
+      handleScroll({
+        x: viewportEl.scrollLeft,
+        y: viewportEl.scrollTop
+      });
+      handlePointerDown(event);
+    },
+    // Native scrollbars don't move focus when pressed, whichever button is used.
+    // Handled here rather than on the thumb so the bubbled press covers both.
+    onMouseDown(event) {
+      event.preventDefault();
+    },
+    onPointerUp: handlePointerUp,
+    // Mirror `onPointerUp` so a browser-cancelled gesture on the track (no thumb
+    // child captures the pointer) still clears the drag state.
+    onPointerCancel: handlePointerUp,
+    style: {
+      position: "absolute",
+      touchAction: "none",
+      WebkitUserSelect: "none",
+      userSelect: "none",
+      visibility: hideTrackUntilMeasured ? "hidden" : void 0,
+      ...vertical ? {
+        top: 0,
+        bottom: `var(${scrollAreaCornerHeight})`,
+        insetInlineEnd: 0,
+        [scrollAreaThumbHeight]: `${thumbSize.height}px`
+      } : {
+        insetInlineStart: 0,
+        insetInlineEnd: `var(${scrollAreaCornerWidth})`,
+        bottom: 0,
+        [scrollAreaThumbWidth]: `${thumbSize.width}px`
+      }
+    }
+  };
+  const element = useRenderElement("div", componentProps, {
+    ref: [forwardedRef, vertical ? scrollbarYRef : scrollbarXRef],
+    state,
+    props: [props, elementProps],
+    stateAttributesMapping: scrollAreaStateAttributesMapping
+  });
+  if (!shouldRender) {
+    return null;
+  }
+  return /* @__PURE__ */ _jsx2(ScrollAreaScrollbarContext.Provider, {
+    value: orientation2,
+    children: element
+  });
+});
+if (process.env.NODE_ENV !== "production") ScrollAreaScrollbar.displayName = "ScrollAreaScrollbar";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/content/ScrollAreaContent.mjs
+import * as React7 from "react";
+var ScrollAreaContent = /* @__PURE__ */ React7.forwardRef(function ScrollAreaContent2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    style,
+    ...elementProps
+  } = componentProps;
+  const {
+    computeThumbPosition
+  } = useScrollAreaViewportContext();
+  const {
+    hasMeasuredScrollbar,
+    viewportState
+  } = useScrollAreaRootContext();
+  const contentWrapperRef = React7.useRef(null);
+  const computeOnInitialResizeRef = React7.useRef(hasMeasuredScrollbar);
+  useIsoLayoutEffect(() => {
+    if (typeof ResizeObserver === "undefined") {
+      return void 0;
+    }
+    let hasInitialized = false;
+    const resizeObserver = new ResizeObserver(() => {
+      if (!hasInitialized) {
+        hasInitialized = true;
+        if (!computeOnInitialResizeRef.current) {
+          return;
+        }
+      }
+      computeThumbPosition();
+    });
+    if (contentWrapperRef.current) {
+      resizeObserver.observe(contentWrapperRef.current);
+    }
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [computeThumbPosition]);
+  const element = useRenderElement("div", componentProps, {
+    ref: [forwardedRef, contentWrapperRef],
+    state: viewportState,
+    stateAttributesMapping: scrollAreaStateAttributesMapping,
+    props: [{
+      role: "presentation",
+      style: {
+        minWidth: "fit-content"
+      }
+    }, elementProps]
+  });
+  return element;
+});
+if (process.env.NODE_ENV !== "production") ScrollAreaContent.displayName = "ScrollAreaContent";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/thumb/ScrollAreaThumb.mjs
+import * as React8 from "react";
+var ScrollAreaThumb = /* @__PURE__ */ React8.forwardRef(function ScrollAreaThumb2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    style,
+    ...elementProps
+  } = componentProps;
+  const {
+    thumbYRef,
+    thumbXRef,
+    handlePointerDown,
+    handlePointerMove,
+    handlePointerUp,
+    scrollingX,
+    scrollingY,
+    hasMeasuredScrollbar
+  } = useScrollAreaRootContext();
+  const orientation2 = useScrollAreaScrollbarContext();
+  const vertical = orientation2 === "vertical";
+  const state = {
+    scrolling: vertical ? scrollingY : scrollingX,
+    orientation: orientation2
+  };
+  const element = useRenderElement("div", componentProps, {
+    ref: [forwardedRef, vertical ? thumbYRef : thumbXRef],
+    state,
+    props: [{
+      onPointerDown: handlePointerDown,
+      onPointerMove: handlePointerMove,
+      onPointerUp: handlePointerUp,
+      onPointerCancel: handlePointerUp,
+      style: {
+        visibility: hasMeasuredScrollbar ? void 0 : "hidden",
+        ...vertical ? {
+          height: "var(--scroll-area-thumb-height)"
+        } : {
+          width: "var(--scroll-area-thumb-width)"
+        }
+      }
+    }, elementProps]
+  });
+  return element;
+});
+if (process.env.NODE_ENV !== "production") ScrollAreaThumb.displayName = "ScrollAreaThumb";
+
+// node_modules/.pnpm/@base-ui+react@1.8.0_@date-fns+tz@1.5.0_@types+react@19.3.0_date-fns@4.4.0_react-dom@19.3.0_react@19.3.0__react@19.3.0/node_modules/@base-ui/react/scroll-area/corner/ScrollAreaCorner.mjs
+import * as React9 from "react";
+var ScrollAreaCorner = /* @__PURE__ */ React9.forwardRef(function ScrollAreaCorner2(componentProps, forwardedRef) {
+  const {
+    render,
+    className,
+    style,
+    ...elementProps
+  } = componentProps;
+  const {
+    cornerRef,
+    cornerSize,
+    hiddenState
+  } = useScrollAreaRootContext();
+  const element = useRenderElement("div", componentProps, {
+    ref: [forwardedRef, cornerRef],
+    props: [{
+      "aria-hidden": true,
+      style: {
+        position: "absolute",
+        bottom: 0,
+        insetInlineEnd: 0,
+        width: cornerSize.width,
+        height: cornerSize.height
+      }
+    }, elementProps]
+  });
+  if (hiddenState.corner) {
+    return null;
+  }
+  return element;
+});
+if (process.env.NODE_ENV !== "production") ScrollAreaCorner.displayName = "ScrollAreaCorner";
+
+// web/app/dist/server/assets/settings-dialog-Drq872Y0.js
+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 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 SettingsRow({ children, className, description, icon, label, trailing }) {
+  const control = trailing ?? children;
+  return /* @__PURE__ */ jsxs(Field, {
+    orientation: "horizontal",
+    className: cn("items-center justify-between gap-6 rounded-xl border border-border/60 bg-card p-4 transition-colors", className),
+    children: [/* @__PURE__ */ jsxs("div", {
+      className: "flex min-w-0 flex-1 items-start gap-3",
+      children: [icon ? /* @__PURE__ */ jsx("div", {
+        className: "flex size-8 shrink-0 items-center justify-center rounded-md border border-border/40 bg-background/60 text-foreground/70",
+        children: icon
+      }) : null, /* @__PURE__ */ jsxs("div", {
+        className: "min-w-0 flex-1",
+        children: [/* @__PURE__ */ jsx(FieldLabel, {
+          className: "text-sm font-medium text-foreground",
+          children: label
+        }), description ? /* @__PURE__ */ jsx(FieldDescription, {
+          className: "mt-0.5 text-xs text-muted-foreground leading-normal",
+          children: description
+        }) : null]
+      })]
+    }), control ? /* @__PURE__ */ jsx("div", {
+      className: "shrink-0",
+      children: control
+    }) : null]
+  });
+}
+var STATUS_COPY = {
+  unconfigured: "Add a key below to turn this on.",
+  unverified: "Checking the key\u2026",
+  ready: "Ready.",
+  error: "The TypeSafe key could not be verified."
+};
+var KEY_SOURCE_COPY = {
+  settings: "Using the key saved here.",
+  environment: "Using TYPESAFE_API_KEY from the server environment.",
+  none: "No key is set."
+};
+function ComposerIntentSection({ enabled, keySource, status, onClearKey, onEnabledChange, onSaveKey }) {
+  const [draftKey, setDraftKey] = useState2("");
+  const [showKey, setShowKey] = useState2(false);
+  const [attemptedSave, setAttemptedSave] = useState2(false);
+  const [saveError, setSaveError] = useState2(null);
+  const [busy, setBusy] = useState2(false);
+  const save = useCallback(async () => {
+    setAttemptedSave(true);
+    setSaveError(null);
+    if (!draftKey.trim() || !onSaveKey) return;
+    setBusy(true);
+    try {
+      await onSaveKey(draftKey.trim());
+      setDraftKey("");
+      setShowKey(false);
+      setAttemptedSave(false);
+    } catch (error) {
+      setSaveError(error instanceof Error ? error.message : "Failed to save key");
+    } finally {
+      setBusy(false);
+    }
+  }, [draftKey, onSaveKey]);
+  const clear = useCallback(async () => {
+    if (!onClearKey) return;
+    setBusy(true);
+    setSaveError(null);
+    try {
+      await onClearKey();
+      setDraftKey("");
+    } catch (error) {
+      setSaveError(error instanceof Error ? error.message : "Failed to remove key");
+    } finally {
+      setBusy(false);
+    }
+  }, [onClearKey]);
+  const unavailable = status === "unconfigured" || status === "error";
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-3",
+    children: [/* @__PURE__ */ jsx(SettingsRow, {
+      label: "Describe a command",
+      description: `Recognise when a message is really asking for a built-in command, like "compact this" or "show the shortcuts". Messages you send are shared with TypeSafe for classification only when this is on. ${STATUS_COPY[status]}`,
+      trailing: /* @__PURE__ */ jsx(Switch$1, {
+        "aria-label": "Describe a command",
+        checked: enabled,
+        disabled: !onEnabledChange || !enabled && unavailable,
+        onCheckedChange: onEnabledChange
+      })
+    }), /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-2 rounded-xl border p-4",
+      children: [
+        /* @__PURE__ */ jsx(SecretCredentialField, {
+          attemptedSave,
+          label: "TypeSafe API key",
+          onChange: (val) => {
+            setDraftKey(val);
+            if (saveError) setSaveError(null);
+          },
+          onToggleVisibility: () => setShowKey((current) => !current),
+          placeholder: "Paste your TypeSafe API key",
+          showPassword: showKey,
+          value: draftKey
+        }),
+        saveError ? /* @__PURE__ */ jsx("p", {
+          className: "text-xs text-destructive",
+          children: saveError
+        }) : null,
+        /* @__PURE__ */ jsx("p", {
+          className: "text-xs text-muted-foreground",
+          children: KEY_SOURCE_COPY[keySource]
+        }),
+        /* @__PURE__ */ jsxs("div", {
+          className: "flex items-center gap-2",
+          children: [/* @__PURE__ */ jsx(Button$1, {
+            type: "button",
+            size: "compact",
+            disabled: busy || !draftKey.trim(),
+            onClick: () => void save(),
+            children: "Save key"
+          }), keySource === "settings" ? /* @__PURE__ */ jsx(Button$1, {
+            type: "button",
+            variant: "outline",
+            size: "compact",
+            disabled: busy,
+            onClick: () => void clear(),
+            children: "Remove key"
+          }) : null]
+        })
+      ]
+    })]
+  });
+}
+function RowSurface({ className, interactive, padding, tone, ...props }) {
+  return /* @__PURE__ */ jsx("div", {
+    className: cn(rowSurface({
+      interactive,
+      padding,
+      tone
+    }), className),
+    ...props
+  });
+}
+function ItemRow({ icon, title, subtitle, trailing, className, interactive = true, tone = "default", truncateSubtitle = true, truncateTitle = true }) {
+  return /* @__PURE__ */ jsxs(RowSurface, {
+    tone,
+    padding: "md",
+    interactive,
+    className: cn("items-center gap-3", className),
+    children: [
+      icon ? /* @__PURE__ */ jsx("div", {
+        className: "flex size-8 shrink-0 items-center justify-center rounded-md border border-border/40 bg-background/60 text-foreground/70",
+        children: icon
+      }) : null,
+      /* @__PURE__ */ jsxs("div", {
+        className: "min-w-0 flex-1",
+        children: [/* @__PURE__ */ jsx("div", {
+          className: cn("text-sm font-medium text-foreground", truncateTitle && "truncate"),
+          children: title
+        }), subtitle ? /* @__PURE__ */ jsx("div", {
+          className: cn("mt-0.5 text-xs text-muted-foreground", truncateSubtitle ? "truncate" : "leading-normal"),
+          children: subtitle
+        }) : null]
+      }),
+      trailing ? /* @__PURE__ */ jsx("div", {
+        className: "flex shrink-0 items-center gap-1.5",
+        children: trailing
+      }) : null
+    ]
+  });
+}
+function SettingsPane({ actions, children, description, title }) {
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-4",
+    children: [/* @__PURE__ */ jsxs("div", {
+      className: "flex items-start justify-between gap-3",
+      children: [/* @__PURE__ */ jsxs("div", {
+        className: "min-w-0 flex-1",
+        children: [/* @__PURE__ */ jsx("h3", {
+          className: "text-lg font-medium text-balance",
+          children: title
+        }), /* @__PURE__ */ jsx("p", {
+          className: "mt-1 text-sm text-pretty text-muted-foreground",
+          children: description
+        })]
+      }), actions ? /* @__PURE__ */ jsx("div", {
+        className: "flex shrink-0 items-center gap-1.5 pt-0.5",
+        children: actions
+      }) : null]
+    }), /* @__PURE__ */ jsx("div", {
+      className: "flex flex-col gap-3",
+      children
+    })]
+  });
+}
+function SettingsCommitActions({ dirty, disabled, onRevert, onSave, saving }) {
+  return /* @__PURE__ */ jsxs(Fragment$1, { children: [dirty ? /* @__PURE__ */ jsx(Button$1, {
+    type: "button",
+    variant: "ghost",
+    size: "icon-compact",
+    className: "text-muted-foreground transition-transform active:scale-[0.96]",
+    disabled: disabled || saving,
+    onClick: onRevert,
+    "aria-label": "Revert changes",
+    children: /* @__PURE__ */ jsx(RotateCcw, {})
+  }) : null, /* @__PURE__ */ jsxs(Button$1, {
+    type: "button",
+    variant: "outline",
+    size: "compact",
+    className: cn(COMPACT_ACTION_BUTTON_CLASS, "transition-transform active:scale-[0.96]", dirty && "border-primary/30 text-primary"),
+    disabled: !dirty || disabled || saving,
+    onClick: onSave,
+    children: [saving ? /* @__PURE__ */ jsx(LoaderCircle, {
+      className: "animate-spin",
+      "data-icon": "inline-start"
+    }) : /* @__PURE__ */ jsx(Save, { "data-icon": "inline-start" }), "Commit"]
+  })] });
+}
+var OAUTH_POLL_MS = 1500;
+var STALE_LOGIN_ERROR = "Unknown or expired OAuth login";
+function delay(ms) {
+  return new Promise((resolve) => {
+    setTimeout(resolve, ms);
+  });
+}
+function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
+  const [login, setLogin] = useState2(null);
+  const [busy, setBusy] = useState2(false);
+  const [promptAnswer, setPromptAnswer] = useState2("");
+  const loginIdRef = useRef4(null);
+  const generationRef = useRef4(0);
+  const startingRef = useRef4(false);
+  const onOAuthLoginRef = useRef4(onOAuthLogin);
+  const onConfiguredRef = useRef4(onConfigured);
+  const providerIdRef = useRef4(providerId);
+  useEffect2(() => {
+    onOAuthLoginRef.current = onOAuthLogin;
+    onConfiguredRef.current = onConfigured;
+    providerIdRef.current = providerId;
+  }, [
+    onConfigured,
+    onOAuthLogin,
+    providerId
+  ]);
+  const cancelLoginId = useCallback(async (loginId) => {
+    if (!loginId || !onOAuthLoginRef.current) return;
+    try {
+      await onOAuthLoginRef.current({
+        providerId: providerIdRef.current,
+        loginId,
+        cancel: true
+      });
+    } catch {
+    }
+  }, []);
+  const resetLocal = useCallback(() => {
+    loginIdRef.current = null;
+    startingRef.current = false;
+    setLogin(null);
+    setPromptAnswer("");
+    setBusy(false);
+  }, []);
+  useEffect2(() => {
+    return () => {
+      generationRef.current += 1;
+      const loginId = loginIdRef.current;
+      loginIdRef.current = null;
+      cancelLoginId(loginId);
+    };
+  }, [cancelLoginId]);
+  const applyResult = useCallback((result, generation) => {
+    if (generation !== generationRef.current) {
+      if (result.status === "waiting" && result.loginId) cancelLoginId(result.loginId);
+      return;
+    }
+    if (result.status === "success") {
+      loginIdRef.current = null;
+      setLogin(null);
+      setPromptAnswer("");
+      setBusy(false);
+      notify.success("Provider credentials applied to your active sessions.");
+      onConfiguredRef.current?.();
+      return;
+    }
+    if (result.status === "error") {
+      if (result.error === STALE_LOGIN_ERROR && loginIdRef.current === null) return;
+      const loginId = loginIdRef.current;
+      loginIdRef.current = null;
+      if (loginId && result.error !== "Login cancelled") cancelLoginId(loginId);
+      setLogin(result);
+      setBusy(false);
+      return;
+    }
+    if (result.loginId) loginIdRef.current = result.loginId;
+    setLogin(result);
+  }, [cancelLoginId]);
+  const start = useCallback(async () => {
+    if (!onOAuthLoginRef.current || startingRef.current) return;
+    startingRef.current = true;
+    const generation = generationRef.current;
+    setBusy(true);
+    const previous = loginIdRef.current;
+    loginIdRef.current = null;
+    setLogin(null);
+    await cancelLoginId(previous);
+    if (generation !== generationRef.current) {
+      startingRef.current = false;
+      return;
+    }
+    try {
+      const result = await onOAuthLoginRef.current({ providerId: providerIdRef.current });
+      applyResult(result, generation);
+    } catch (error) {
+      if (generation !== generationRef.current) return;
+      setLogin({
+        status: "error",
+        error: error instanceof Error ? error.message : "Failed to start OAuth sign-in"
+      });
+    } finally {
+      startingRef.current = false;
+      if (generation === generationRef.current) setBusy(false);
+    }
+  }, [applyResult, cancelLoginId]);
+  const submitPrompt = useCallback(async () => {
+    const loginId = loginIdRef.current;
+    if (!onOAuthLoginRef.current || !loginId) return;
+    const generation = generationRef.current;
+    setBusy(true);
+    try {
+      const result = await onOAuthLoginRef.current({
+        providerId: providerIdRef.current,
+        loginId,
+        promptAnswer
+      });
+      setPromptAnswer("");
+      applyResult(result, generation);
+    } catch (error) {
+      if (generation !== generationRef.current) return;
+      notify.error(error instanceof Error ? error.message : "Failed to continue OAuth sign-in");
+    } finally {
+      if (generation === generationRef.current) setBusy(false);
+    }
+  }, [applyResult, promptAnswer]);
+  const cancel = useCallback(async () => {
+    generationRef.current += 1;
+    const loginId = loginIdRef.current;
+    resetLocal();
+    await cancelLoginId(loginId);
+  }, [cancelLoginId, resetLocal]);
+  useEffect2(() => {
+    if (!onOAuthLoginRef.current) return;
+    if (login?.status !== "waiting" || !login.loginId) return;
+    const generation = generationRef.current;
+    const loginId = login.loginId;
+    let stopped = false;
+    const poll = async () => {
+      while (!stopped) {
+        try {
+          const result = await onOAuthLoginRef.current({
+            providerId: providerIdRef.current,
+            loginId
+          });
+          if (stopped || generation !== generationRef.current) return;
+          applyResult(result, generation);
+          if (result.status !== "waiting") return;
+        } catch (error) {
+          if (stopped || generation !== generationRef.current) return;
+          if (loginIdRef.current !== loginId) return;
+          loginIdRef.current = null;
+          cancelLoginId(loginId);
+          setLogin({
+            status: "error",
+            error: error instanceof Error ? error.message : "OAuth sign-in failed"
+          });
+          return;
+        }
+        await delay(OAUTH_POLL_MS);
+        if (stopped || generation !== generationRef.current) return;
+        if (loginIdRef.current !== loginId) return;
+      }
+    };
+    poll();
+    return () => {
+      stopped = true;
+    };
+  }, [
+    applyResult,
+    cancelLoginId,
+    login?.loginId,
+    login?.status
+  ]);
+  return {
+    busy,
+    cancel,
+    canStart: Boolean(onOAuthLogin),
+    login,
+    promptAnswer,
+    setPromptAnswer,
+    start,
+    submitPrompt
+  };
+}
+function ProviderOAuthSignIn({ onConfigured, onOAuthLogin, provider }) {
+  const { busy, cancel, canStart, login, promptAnswer, setPromptAnswer, start, submitPrompt } = useOAuthLoginFlow({
+    onConfigured,
+    onOAuthLogin,
+    providerId: provider.id
+  });
+  const waiting = login?.status === "waiting";
+  const error = login?.status === "error" ? login.error : void 0;
+  const authUrl = waiting ? login?.authUrl : void 0;
+  const userCode = waiting ? login?.userCode : void 0;
+  const instructions = waiting ? login?.instructions : void 0;
+  const prompt = waiting ? login?.prompt : void 0;
+  const oauthOnly = provider.authType === "oauth";
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-3",
+    children: [provider.isConfigured && oauthOnly && !waiting ? /* @__PURE__ */ jsxs("div", {
+      className: "flex items-center gap-2 text-sm",
+      children: [/* @__PURE__ */ jsx(Check, { className: "size-3.5 text-muted-foreground" }), /* @__PURE__ */ jsx("span", { children: "Connected" })]
+    }) : null, waiting ? /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-2",
+      children: [
+        /* @__PURE__ */ jsxs("p", {
+          className: "text-sm",
+          children: [
+            "Sign in with ",
+            provider.name,
+            " to store OAuth credentials for this account."
+          ]
+        }),
+        userCode ? /* @__PURE__ */ jsxs("p", {
+          className: "text-sm",
+          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",
+          children: instructions
+        }) : null,
+        authUrl ? /* @__PURE__ */ jsxs(Button$1, {
+          type: "button",
+          size: "compact",
+          onClick: () => {
+            window.open(authUrl, "_blank", "noopener,noreferrer");
+          },
+          children: [/* @__PURE__ */ jsx(ExternalLink, { "data-icon": "inline-start" }), "Open sign-in page"]
+        }) : prompt ? null : /* @__PURE__ */ jsxs("div", {
+          className: "flex items-center gap-2 text-xs text-muted-foreground",
+          children: [/* @__PURE__ */ jsx(Spinner, { className: "size-3" }), "Waiting for sign-in\u2026"]
+        }),
+        prompt ? /* @__PURE__ */ jsxs("div", {
+          className: "flex flex-col gap-2",
+          children: [
+            /* @__PURE__ */ jsx("p", {
+              className: "text-xs text-pretty text-muted-foreground",
+              children: prompt.message
+            }),
+            /* @__PURE__ */ jsx(Input$1, {
+              value: promptAnswer,
+              placeholder: prompt.placeholder,
+              onChange: (event) => setPromptAnswer(event.target.value),
+              "aria-label": prompt.message
+            }),
+            /* @__PURE__ */ jsx("div", {
+              className: "flex justify-end",
+              children: /* @__PURE__ */ jsxs(Button$1, {
+                type: "button",
+                size: "compact",
+                disabled: busy || !prompt.allowEmpty && !promptAnswer.trim(),
+                onClick: () => {
+                  submitPrompt();
+                },
+                children: [busy ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Continue"]
+              })
+            })
+          ]
+        }) : null,
+        /* @__PURE__ */ jsx("div", {
+          className: "flex justify-end",
+          children: /* @__PURE__ */ jsx(Button$1, {
+            type: "button",
+            variant: "ghost",
+            size: "compact",
+            disabled: busy,
+            onClick: () => {
+              cancel();
+            },
+            children: "Cancel sign-in"
+          })
+        })
+      ]
+    }) : /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-2",
+      children: [error ? /* @__PURE__ */ jsx(Alert, {
+        className: "px-3 py-2",
+        children: /* @__PURE__ */ jsx(AlertDescription, {
+          className: "text-xs text-pretty",
+          children: error
+        })
+      }) : /* @__PURE__ */ jsx("p", {
+        className: "text-xs text-pretty text-muted-foreground",
+        children: oauthOnly && provider.isConfigured ? `Sign in again with ${provider.name} to refresh OAuth credentials.` : oauthOnly ? `Sign in with ${provider.name}. No API key is stored; credentials are saved to auth.json.` : `Sign in with ${provider.name} to use OAuth credentials; API-key editing remains available above.`
+      }), /* @__PURE__ */ jsx("div", {
+        className: "flex justify-end",
+        children: /* @__PURE__ */ jsxs(Button$1, {
+          type: "button",
+          size: "compact",
+          disabled: busy || !canStart,
+          onClick: () => {
+            start();
+          },
+          children: [
+            busy ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null,
+            "Sign in with ",
+            provider.name
+          ]
+        })
+      })]
+    })]
+  });
+}
+function statusLabel(connection) {
+  switch (connection.status) {
+    case "connected":
+      return "Connected";
+    case "anonymous":
+      return "Available without sign-in";
+    case "needs_auth":
+      return "Sign-in required";
+    case "disabled":
+      return "Disabled";
+    default:
+      return connection.status;
+  }
+}
+function connectionSubtitle(connection) {
+  const details = connection.transport === "http" ? connection.url : connection.commandPreview;
+  return [
+    connection.source === "builtin" ? "Built-in" : "User",
+    connection.transport === "http" ? "HTTP" : "stdio",
+    statusLabel(connection),
+    details
+  ].filter((part) => Boolean(part)).join(" \xB7 ");
+}
+function McpConnectionsSection({ connections, isLoading, isPending, onOAuth, onRemove, onUpsert }) {
+  const [adding, setAdding] = useState2(false);
+  const [transport, setTransport] = useState2("http");
+  const [name, setName] = useState2("");
+  const [url, setUrl] = useState2("");
+  const [oauth, setOauth] = useState2(true);
+  const [bearerTokenEnvVar, setBearerTokenEnvVar] = useState2("");
+  const [command, setCommand] = useState2("");
+  const [args, setArgs] = useState2("");
+  const [cwd, setCwd] = useState2("");
+  const [envLines, setEnvLines] = useState2("");
+  const [confirmRemove, setConfirmRemove] = useState2(null);
+  const resetAddForm = () => {
+    setName("");
+    setUrl("");
+    setOauth(true);
+    setBearerTokenEnvVar("");
+    setCommand("");
+    setArgs("");
+    setCwd("");
+    setEnvLines("");
+    setTransport("http");
+    setAdding(false);
+  };
+  const handleAdd = async () => {
+    if (!onUpsert) return;
+    const trimmedName = name.trim();
+    try {
+      if (transport === "http") await onUpsert({
+        name: trimmedName,
+        transport: "http",
+        url: url.trim(),
+        ...oauth ? { oauth: true } : {},
+        ...bearerTokenEnvVar.trim() ? { bearerTokenEnvVar: bearerTokenEnvVar.trim() } : {},
+        force: true
+      });
+      else {
+        const parsedArgs = args.split(/\s+/).map((part) => part.trim()).filter(Boolean);
+        const env = envLines.split("\n").map((line) => line.trim()).filter(Boolean).flatMap((line) => {
+          const equals = line.indexOf("=");
+          if (equals <= 0) return [];
+          const child = line.slice(0, equals).trim();
+          const source = line.slice(equals + 1).trim();
+          if (!child || !source) return [];
+          return [{
+            child,
+            source
+          }];
+        });
+        await onUpsert({
+          name: trimmedName,
+          transport: "stdio",
+          command: command.trim(),
+          ...parsedArgs.length > 0 ? { args: parsedArgs } : {},
+          ...cwd.trim() ? { cwd: cwd.trim() } : {},
+          ...env.length > 0 ? { env } : {},
+          force: true
+        });
+      }
+      notify.success("MCP connection saved");
+      resetAddForm();
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Could not save MCP connection");
+    }
+  };
+  const handleRemove = async (connectionName) => {
+    if (!onRemove) return;
+    try {
+      await onRemove({ name: connectionName });
+      notify.success(`Removed ${connectionName}`);
+      setConfirmRemove(null);
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Could not remove MCP connection");
+    }
+  };
+  const handleLogout = async (connectionName) => {
+    if (!onOAuth) return;
+    try {
+      await onOAuth({
+        name: connectionName,
+        action: "logout"
+      });
+      notify.success(`Signed out of ${connectionName}`);
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Could not sign out");
+    }
+  };
+  const oauthAdapter = useMemo3(() => {
+    if (!onOAuth) return void 0;
+    return (connection) => async (request) => {
+      const starting = !request.loginId && !request.cancel;
+      return await onOAuth({
+        name: connection.name,
+        action: starting && connection.status === "connected" ? "reconnect" : "login",
+        loginId: request.loginId,
+        promptAnswer: request.promptAnswer,
+        cancel: request.cancel
+      });
+    };
+  }, [onOAuth]);
+  return /* @__PURE__ */ jsxs(SettingsPane, {
+    title: "MCP",
+    description: "Connect built-in and user MCP servers. Tokens stay on the server; this list only shows status and environment-variable names.",
+    actions: /* @__PURE__ */ jsxs(Button$1, {
+      type: "button",
+      size: "compact",
+      variant: "outline",
+      disabled: isPending || adding,
+      onClick: () => setAdding(true),
+      children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add server"]
+    }),
+    children: [
+      isLoading ? /* @__PURE__ */ jsxs("div", {
+        className: "flex items-center gap-2 text-sm text-muted-foreground",
+        children: [/* @__PURE__ */ jsx(Spinner, { className: "size-3.5" }), "Loading MCP connections\u2026"]
+      }) : null,
+      adding ? /* @__PURE__ */ jsxs("div", {
+        className: "flex flex-col gap-3 rounded-xl border p-4",
+        children: [
+          /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Name" }), /* @__PURE__ */ jsx(Input$1, {
+            value: name,
+            onChange: (event) => setName(event.target.value),
+            "aria-label": "MCP server name"
+          })] }),
+          /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Transport" }), /* @__PURE__ */ jsx(Select$1, {
+            value: transport,
+            onValueChange: (value) => setTransport(value),
+            options: [{
+              label: "HTTP",
+              value: "http"
+            }, {
+              label: "stdio",
+              value: "stdio"
+            }]
+          })] }),
+          transport === "http" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+            /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "URL" }), /* @__PURE__ */ jsx(Input$1, {
+              value: url,
+              onChange: (event) => setUrl(event.target.value),
+              "aria-label": "MCP server URL"
+            })] }),
+            /* @__PURE__ */ jsxs(Field, {
+              orientation: "horizontal",
+              className: "items-center justify-between",
+              children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "OAuth" }), /* @__PURE__ */ jsx(FieldDescription, { children: "Use the browser sign-in flow for this server." })] }), /* @__PURE__ */ jsx(Switch$1, {
+                checked: oauth,
+                onCheckedChange: (checked) => setOauth(checked),
+                "aria-label": "Use OAuth"
+              })]
+            }),
+            !oauth ? /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Bearer token environment variable" }), /* @__PURE__ */ jsx(Input$1, {
+              value: bearerTokenEnvVar,
+              onChange: (event) => setBearerTokenEnvVar(event.target.value),
+              "aria-label": "Bearer token environment variable",
+              placeholder: "MCP_BEARER_TOKEN"
+            })] }) : null
+          ] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+            /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Command" }), /* @__PURE__ */ jsx(Input$1, {
+              value: command,
+              onChange: (event) => setCommand(event.target.value),
+              "aria-label": "MCP command"
+            })] }),
+            /* @__PURE__ */ jsxs(Field, { children: [/* @__PURE__ */ jsx(FieldLabel, { children: "Arguments" }), /* @__PURE__ */ jsx(Input$1, {
+              value: args,
+              onChange: (event) => setArgs(event.target.value),
+              "aria-label": "MCP command arguments"
+            })] }),
+            /* @__PURE__ */ jsxs(Field, { children: [
+              /* @__PURE__ */ jsx(FieldLabel, { children: "Working directory" }),
+              /* @__PURE__ */ jsx(Input$1, {
+                value: cwd,
+                onChange: (event) => setCwd(event.target.value),
+                "aria-label": "MCP working directory"
+              }),
+              /* @__PURE__ */ jsx(FieldDescription, { children: "Must stay inside the current workspace." })
+            ] }),
+            /* @__PURE__ */ jsxs(Field, { children: [
+              /* @__PURE__ */ jsx(FieldLabel, { children: "Environment mappings" }),
+              /* @__PURE__ */ jsx(Textarea, {
+                value: envLines,
+                onChange: (event) => setEnvLines(event.target.value),
+                "aria-label": "MCP environment mappings",
+                placeholder: "CHILD=SOURCE"
+              }),
+              /* @__PURE__ */ jsx(FieldDescription, { children: "One CHILD=SOURCE pair per line. Only variable names are stored." })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", {
+            className: "flex justify-end gap-2",
+            children: [/* @__PURE__ */ jsx(Button$1, {
+              type: "button",
+              size: "compact",
+              variant: "ghost",
+              onClick: resetAddForm,
+              children: "Cancel"
+            }), /* @__PURE__ */ jsxs(Button$1, {
+              type: "button",
+              size: "compact",
+              disabled: isPending || !name.trim(),
+              onClick: () => void handleAdd(),
+              children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
+            })]
+          })
+        ]
+      }) : null,
+      !isLoading && connections.length === 0 && !adding ? /* @__PURE__ */ jsx("p", {
+        className: "text-sm text-muted-foreground",
+        children: "No MCP connections yet."
+      }) : null,
+      /* @__PURE__ */ jsx("div", {
+        className: "flex flex-col gap-2",
+        children: connections.map((connection) => /* @__PURE__ */ jsxs("div", {
+          className: "flex flex-col gap-2",
+          children: [
+            /* @__PURE__ */ jsx(ItemRow, {
+              icon: /* @__PURE__ */ jsx(Plug, { className: "size-4" }),
+              title: connection.label,
+              subtitle: connectionSubtitle(connection),
+              trailing: /* @__PURE__ */ jsxs("div", {
+                className: "flex items-center gap-1.5",
+                children: [connection.usesOAuth && connection.status !== "needs_auth" ? /* @__PURE__ */ jsx(Button$1, {
+                  type: "button",
+                  size: "compact",
+                  variant: "ghost",
+                  disabled: isPending || !onOAuth,
+                  onClick: () => {
+                    handleLogout(connection.name);
+                  },
+                  children: "Sign out"
+                }) : null, connection.source === "user" ? confirmRemove === connection.name ? /* @__PURE__ */ jsx(Button$1, {
+                  type: "button",
+                  size: "compact",
+                  variant: "destructive",
+                  disabled: isPending,
+                  onClick: () => {
+                    handleRemove(connection.name);
+                  },
+                  children: "Confirm remove"
+                }) : /* @__PURE__ */ jsx(Button$1, {
+                  type: "button",
+                  size: "compact",
+                  variant: "ghost",
+                  disabled: isPending || !onRemove,
+                  "aria-label": `Remove ${connection.name}`,
+                  onClick: () => setConfirmRemove(connection.name),
+                  children: /* @__PURE__ */ jsx(Trash, { className: "size-3.5" })
+                }) : null]
+              })
+            }),
+            connection.error ? /* @__PURE__ */ jsx(Alert, {
+              className: "px-3 py-2",
+              children: /* @__PURE__ */ jsx(AlertDescription, {
+                className: "text-xs text-pretty",
+                children: connection.error
+              })
+            }) : null,
+            connection.usesOAuth && oauthAdapter ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
+              provider: {
+                id: connection.name,
+                name: connection.label,
+                isConfigured: connection.status === "connected",
+                envVarName: "",
+                authType: "oauth",
+                supportsOAuth: true
+              },
+              onOAuthLogin: oauthAdapter(connection)
+            }) : null
+          ]
+        }, `${connection.source}:${connection.name}`))
+      })
+    ]
+  });
+}
+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$1, {
+        "aria-label": "Theme",
+        className: "w-[160px]",
+        onValueChange: (value) => onThemePreferenceChange(value),
+        options: [...THEME_OPTIONS],
+        value: themePreference
+      })
+    })]
+  });
+}
+function customModelKey(provider, model) {
+  return `${provider}/${model}`;
+}
+function isModelEnabled(model, patterns) {
+  return isModelPatternEnabled({
+    id: model.id,
+    name: model.name,
+    provider: model.provider,
+    modelId: model.modelId
+  }, patterns);
+}
+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 modelPatternFor(model) {
+  return modelPattern(model.provider, model.modelId);
+}
+function searchableModelText(model) {
+  return [
+    model.name,
+    model.modelId,
+    model.provider,
+    model.id
+  ].join(" ").toLowerCase();
+}
+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 = useMemo3(() => {
+    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 = useMemo3(() => {
+    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 = useMemo3(() => {
+    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 = useMemo3(() => {
+    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 confirmAdd = () => {
+    const selected = candidateModels.filter((model) => selectedKeys.has(model.id));
+    if (selected.length > 0) onAddModels(selected);
+    onOpenChange(false);
+  };
+  return /* @__PURE__ */ jsx(Dialog$1, {
+    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$1, {
+              type: "button",
+              variant: "outline",
+              size: "compact",
+              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-caption 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$1, {
+            type: "button",
+            variant: "ghost",
+            size: "compact",
+            onClick: () => onOpenChange(false),
+            children: "Cancel"
+          }), /* @__PURE__ */ jsxs(Button$1, {
+            type: "button",
+            size: "compact",
+            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 disabled = !draft || settingsLoading;
+  const normalizedFilter = modelFilter.trim().toLowerCase();
+  const configuredProviderIds = useMemo3(() => {
+    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 = useMemo3(() => {
+    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 = useMemo3(() => {
+    return (model) => !!draft?.defaultProvider && !!draft?.defaultModel && model.provider === draft.defaultProvider && model.modelId === draft.defaultModel;
+  }, [draft?.defaultModel, draft?.defaultProvider]);
+  const providerLabel = useMemo3(() => {
+    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 = useMemo3(() => {
+    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 = useMemo3(() => {
+    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,
+      onRevert,
+      onSave,
+      saving
+    }),
+    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: disabled || listedModels.length === 0
+          })]
+        }), /* @__PURE__ */ jsxs(Button$1, {
+          type: "button",
+          variant: "outline",
+          size: "compact",
+          disabled,
+          onClick: openAddDialog,
+          children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
+        })]
+      }),
+      /* @__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$1, {
+            type: "button",
+            variant: "outline",
+            size: "compact",
+            disabled,
+            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$1, {
+                type: "button",
+                variant: "ghost",
+                size: "compact",
+                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,
+                "aria-label": `Set ${model.name} as default`,
+                onClick: () => onSetDefaultModel(model),
+                children: [/* @__PURE__ */ jsx(Star, { "data-icon": "inline-start" }), "Set default"]
+              }) : null, /* @__PURE__ */ jsxs(Button$1, {
+                type: "button",
+                variant: "ghost",
+                size: "compact",
+                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,
+                "aria-label": `Remove ${model.name}`,
+                onClick: () => onRemoveModel(model),
+                children: [/* @__PURE__ */ jsx(Trash, { "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 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$1, {
+      "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;
+}
+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 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 = useMemo3(() => {
+    return [...providers.filter((provider) => provider.id !== CUSTOM_PROVIDER_PICKER_ROW.id), CUSTOM_PROVIDER_PICKER_ROW];
+  }, [providers]);
+  const activeProviders = useMemo3(() => credentialProviders.filter((provider) => provider.isConfigured), [credentialProviders]);
+  const unconfiguredProviders = useMemo3(() => credentialProviders.filter((provider) => !provider.isConfigured || provider.id === "openai-chat-completions" && provider.providerFamily === void 0), [credentialProviders]);
+  const filteredActiveProviders = useMemo3(() => {
+    const query = searchQuery.trim().toLowerCase();
+    if (!query) return activeProviders;
+    return activeProviders.filter((provider) => providerMatchesQuery(provider, query));
+  }, [activeProviders, searchQuery]);
+  const filteredPickerAvailable = useMemo3(() => {
+    const query = addPickerQuery.trim().toLowerCase();
+    return unconfiguredProviders.filter((provider) => providerMatchesQuery(provider, query));
+  }, [addPickerQuery, unconfiguredProviders]);
+  const filteredPickerConfigured = useMemo3(() => {
+    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");
+    }
+  };
+  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: useMemo3(() => {
+      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$1, {
+          type: "button",
+          variant: "ghost",
+          size: "icon-compact",
+          "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: "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-caption 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$1, {
+        type: "button",
+        variant: "ghost",
+        size: "icon-compact",
+        "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__ */ jsxs("div", {
+        className: "flex items-center gap-2",
+        children: [/* @__PURE__ */ jsx(Button$1, {
+          type: "button",
+          variant: "ghost",
+          size: "icon-compact",
+          "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(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$1, {
+          type: "button",
+          variant: "ghost",
+          size: "compact",
+          onClick: onCancel,
+          children: "Cancel"
+        }), /* @__PURE__ */ jsxs(Button$1, {
+          type: "button",
+          size: "compact",
+          disabled: isPending || !canSave,
+          onClick: onSave,
+          children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
+        })]
+      }),
+      oauthAvailable ? /* @__PURE__ */ jsx(ProviderOAuthSignIn, {
+        provider,
+        onConfigured: onConfigured ?? onCancel,
+        onOAuthLogin
+      }, `${provider.id}-oauth`) : null
+    ]
+  });
+}
+function RemoveProviderConfirmDialog({ confirmRemoveProvider, isPending, onClose, onConfirm }) {
+  return /* @__PURE__ */ jsx(AlertDialog$1, {
+    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$1, {
+              type: "button",
+              variant: "ghost",
+              size: "compact",
+              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(Trash, { "data-icon": "inline-start" }), "Remove"]
+            }), /* @__PURE__ */ jsxs(Button$1, {
+              type: "button",
+              variant: "ghost",
+              size: "compact",
+              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$1, {
+                type: "button",
+                size: "compact",
+                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$1, {
+          type: "button",
+          variant: "outline",
+          size: "compact",
+          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$1, {
+          type: "button",
+          variant: "outline",
+          size: "compact",
+          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 modelSettings(settings) {
+  return {
+    defaultProvider: settings.defaultProvider,
+    defaultModel: settings.defaultModel,
+    defaultThinkingLevel: settings.defaultThinkingLevel,
+    enabledModels: settings.enabledModels === void 0 ? null : sanitizeStringList(settings.enabledModels)
+  };
+}
+function comparableModelSettings(settings) {
+  const enabledRaw = settings.enabledModels;
+  const enabledModels = enabledRaw === void 0 || enabledRaw === null ? null : sanitizeStringList(enabledRaw).toSorted();
+  return {
+    defaultProvider: settings.defaultProvider,
+    defaultModel: settings.defaultModel,
+    defaultThinkingLevel: settings.defaultThinkingLevel,
+    enabledModels
+  };
+}
+function resourceSettings(settings) {
+  return {
+    packages: settings.packages,
+    extensions: sanitizeStringList(settings.extensions),
+    skills: sanitizeStringList(settings.skills),
+    prompts: sanitizeStringList(settings.prompts),
+    themes: sanitizeStringList(settings.themes),
+    enableSkillCommands: settings.enableSkillCommands
+  };
+}
+function harnessSettings(settings) {
+  return {
+    compaction: {
+      enabled: settings.compaction.enabled,
+      reserveTokens: settings.compaction.reserveTokens,
+      keepRecentTokens: settings.compaction.keepRecentTokens
+    },
+    retry: {
+      enabled: settings.retry.enabled,
+      maxRetries: settings.retry.maxRetries,
+      baseDelayMs: settings.retry.baseDelayMs
+    },
+    transport: settings.transport,
+    steeringMode: settings.steeringMode,
+    followUpMode: settings.followUpMode
+  };
+}
+function sameJson(left, right) {
+  return JSON.stringify(left) === JSON.stringify(right);
+}
+function summarizeResources(resources) {
+  const catalog = resources ? [
+    ...resources.skills,
+    ...resources.prompts,
+    ...resources.extensions,
+    ...resources.packages,
+    ...resources.themes,
+    ...resources.agentsFiles
+  ] : [];
+  return {
+    active: catalog.filter((item) => item.activationStatus === "active").length,
+    staged: catalog.filter((item) => item.activationStatus === "staged").length,
+    reloadRequired: catalog.filter((item) => item.activationStatus === "reload-required").length,
+    diagnostics: resources?.diagnostics ?? [],
+    total: catalog.length
+  };
+}
+function formatPackageSourceRows(values) {
+  return values.map((item) => typeof item === "string" ? item : JSON.stringify(item));
+}
+function parsePackageSourceRows(rows) {
+  const parsedRows = [];
+  for (const line of rows) {
+    const trimmed = line.trim();
+    if (!trimmed) continue;
+    if (!trimmed.startsWith("{")) {
+      parsedRows.push(trimmed);
+      continue;
+    }
+    const parsed = JSON.parse(trimmed);
+    if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) throw new Error("Package JSON entries must be objects.");
+    parsedRows.push(parsed);
+  }
+  return parsedRows;
+}
+function sanitizeStringList(values) {
+  return values.flatMap((item) => {
+    const trimmed = item.trim();
+    return trimmed ? [trimmed] : [];
+  });
+}
+function useModelDefaultsForm({ draft, setDraft, updateDraft, settings, providers, models, modelCatalog, onDiscoverModels, saveSettings, setSavingSection }) {
+  const [modelFilter, setModelFilter] = useState2("");
+  const [discoveredModels, setDiscoveredModels] = useState2([]);
+  const [discoveringProviderId, setDiscoveringProviderId] = useState2(null);
+  const lastCommittedModelSettings = useRef4(null);
+  const configuredProviderIds = useMemo3(() => {
+    const ids = /* @__PURE__ */ new Set();
+    for (const provider of providers) if (provider.isConfigured) ids.add(provider.id);
+    return ids;
+  }, [providers]);
+  const catalogModels = modelCatalog ?? models;
+  const modelOptions = useMemo3(() => {
+    const byId = /* @__PURE__ */ new Map();
+    for (const model of catalogModels) if (configuredProviderIds.has(model.provider)) byId.set(model.id, model);
+    for (const model of discoveredModels) if (configuredProviderIds.has(model.provider)) byId.set(model.id, model);
+    const merged = [...byId.values()];
+    if (!draft?.defaultProvider || !draft.defaultModel) return merged;
+    if (merged.some((model) => model.provider === draft.defaultProvider && model.modelId === draft.defaultModel)) return merged;
+    if (!configuredProviderIds.has(draft.defaultProvider)) return merged;
+    return [{
+      id: customModelKey(draft.defaultProvider, draft.defaultModel),
+      name: draft.defaultModel,
+      provider: draft.defaultProvider,
+      modelId: draft.defaultModel,
+      available: false
+    }, ...merged];
+  }, [
+    catalogModels,
+    configuredProviderIds,
+    discoveredModels,
+    draft
+  ]);
+  const modelBaseline = lastCommittedModelSettings.current ?? (settings ? comparableModelSettings(settings.effective) : null);
+  const modelDirty = !!draft && !!modelBaseline && !sameJson(comparableModelSettings(draft), modelBaseline);
+  const resetCommittedModelBaseline = useCallback(() => {
+    lastCommittedModelSettings.current = null;
+  }, []);
+  const commitModelSettings = async (nextDraft, options) => {
+    setDraft(nextDraft);
+    setSavingSection("models");
+    try {
+      const response = await saveSettings(modelSettings(nextDraft));
+      const committed = {
+        ...response.effective,
+        enabledModels: response.project.enabledModels ?? nextDraft.enabledModels ?? response.effective.enabledModels,
+        defaultProvider: response.project.defaultProvider ?? nextDraft.defaultProvider ?? response.effective.defaultProvider,
+        defaultModel: response.project.defaultModel ?? nextDraft.defaultModel ?? response.effective.defaultModel,
+        defaultThinkingLevel: response.project.defaultThinkingLevel ?? nextDraft.defaultThinkingLevel ?? response.effective.defaultThinkingLevel
+      };
+      lastCommittedModelSettings.current = comparableModelSettings(committed);
+      setDraft(committed);
+      if (!options?.silent) notify.success("Pi settings saved");
+      return true;
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Settings save failed");
+      return false;
+    } finally {
+      setSavingSection(null);
+    }
+  };
+  const persistModelSettings = (nextDraft) => {
+    commitModelSettings(nextDraft);
+  };
+  const setModelEnabled = (model, enabled) => {
+    if (!draft) return;
+    const nextDraft = {
+      ...draft,
+      enabledModels: nextEnabledModelPatterns({
+        currentPatterns: draft.enabledModels,
+        enabled,
+        model,
+        models: modelOptions
+      })
+    };
+    persistModelSettings(nextDraft);
+  };
+  const addModels = (modelsToAdd) => {
+    if (!draft || modelsToAdd.length === 0) return;
+    let patterns = draft.enabledModels;
+    for (const model of modelsToAdd) patterns = nextEnabledModelPatterns({
+      currentPatterns: patterns,
+      enabled: true,
+      model,
+      models: modelOptions
+    });
+    persistModelSettings({
+      ...draft,
+      enabledModels: patterns
+    });
+  };
+  const removeModel = (model) => {
+    setModelEnabled(model, false);
+  };
+  const setDefaultModel = (model) => {
+    if (!draft) return;
+    commitModelSettings({
+      ...draft,
+      defaultProvider: model.provider,
+      defaultModel: model.modelId
+    });
+  };
+  const discoverProvider = async (providerId) => {
+    if (!onDiscoverModels) return;
+    setDiscoveringProviderId(providerId);
+    try {
+      const discovered = await onDiscoverModels(providerId);
+      setDiscoveredModels((current) => {
+        const byId = new Map(current.map((model) => [model.id, model]));
+        for (const model of discovered) byId.set(model.id, model);
+        return [...byId.values()];
+      });
+    } finally {
+      setDiscoveringProviderId(null);
+    }
+  };
+  const revertModelDraft = () => {
+    if (!settings) return;
+    updateDraft((current) => ({
+      ...current,
+      defaultProvider: settings.effective.defaultProvider,
+      defaultModel: settings.effective.defaultModel,
+      defaultThinkingLevel: settings.effective.defaultThinkingLevel,
+      enabledModels: settings.effective.enabledModels
+    }));
+  };
+  return {
+    modelFilter,
+    setModelFilter,
+    modelOptions,
+    modelDirty,
+    addModels,
+    removeModel,
+    setDefaultModel,
+    discoverProvider,
+    discoveringProviderId,
+    commitModelSettings,
+    revertModelDraft,
+    resetCommittedModelBaseline
+  };
+}
+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 disabled = !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$1, {
+          "aria-label": "Compaction",
+          checked: draft?.compaction.enabled ?? false,
+          disabled,
+          onCheckedChange: (enabled) => updateDraft((current) => ({
+            ...current,
+            compaction: {
+              ...current.compaction,
+              enabled
+            }
+          }))
+        })
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Auto-retry",
+        subtitle: "Retry failed provider requests",
+        trailing: /* @__PURE__ */ jsx(Switch$1, {
+          "aria-label": "Auto-retry",
+          checked: draft?.retry.enabled ?? false,
+          disabled,
+          onCheckedChange: (enabled) => updateDraft((current) => ({
+            ...current,
+            retry: {
+              ...current.retry,
+              enabled
+            }
+          }))
+        })
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        title: "Transport",
+        trailing: /* @__PURE__ */ jsx(Select$1, {
+          "aria-label": "Transport",
+          className: "w-[160px]",
+          disabled,
+          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$1, {
+          "aria-label": "Steering",
+          className: "w-[160px]",
+          disabled,
+          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$1, {
+          "aria-label": "Follow-up",
+          className: "w-[160px]",
+          disabled,
+          onValueChange: (value) => updateDraft((current) => ({
+            ...current,
+            followUpMode: value
+          })),
+          options: [...DELIVERY_OPTIONS],
+          value: draft?.followUpMode ?? "all"
+        })
+      })
+    ]
+  });
+}
+var PROVENANCE_SOURCES = /* @__PURE__ */ new Set([
+  "auto",
+  "global",
+  "local",
+  "project",
+  "workspace"
+]);
+function resourceOptionValue(item) {
+  const source = item.source?.trim();
+  if (source && !PROVENANCE_SOURCES.has(source)) return source;
+  const rawPath = (item.workspacePath ?? item.path ?? "").trim();
+  if (rawPath) return toSettingsResourcePath(rawPath);
+  return item.name.trim();
+}
+function toSettingsResourcePath(path) {
+  const normalized = path.replace(/\\/g, "/");
+  if (/^\/Users\//.test(normalized) || /^\/home\//.test(normalized)) return "";
+  if (/^[A-Za-z]:\//.test(normalized)) return "";
+  if (!normalized.startsWith("/") && !/^[A-Za-z]:\//.test(normalized)) {
+    if (normalized.startsWith("agent-workspace/")) return stripResourceFileSuffix(`../${normalized}`);
+    if (normalized.startsWith("../agent-workspace/.pi/")) return stripResourceFileSuffix(normalized.replace("../agent-workspace/.pi/", "../agent-workspace/pi/"));
+    return stripResourceFileSuffix(normalized);
+  }
+  const workspaceMatch = normalized.match(/\/(agent-workspace\/.+)$/);
+  if (workspaceMatch?.[1]) return stripResourceFileSuffix(`../${workspaceMatch[1].replace(/^agent-workspace\/\.pi\//, "agent-workspace/pi/")}`);
+  const piMatch = normalized.match(/\/\.pi\/(extensions\/.+|skills\/.+|prompts\/.+|themes\/.+)$/);
+  if (piMatch?.[1]) return stripResourceFileSuffix(piMatch[1]);
+  return "";
+}
+function stripResourceFileSuffix(path) {
+  return path.replace(/\/SKILL\.md$/i, "").replace(/\/index\.(ts|tsx|js|jsx|mjs|cjs)$/i, "");
+}
+function settingsResourceListIncludes(values, candidate) {
+  const canonical = toSettingsResourcePath(candidate);
+  return values.some((value) => toSettingsResourcePath(value) === canonical);
+}
+function addUniqueSettingsResource(values, next) {
+  const trimmed = next.trim();
+  if (!trimmed) return values;
+  const canonical = toSettingsResourcePath(trimmed);
+  if (!canonical) return values;
+  if (settingsResourceListIncludes(values, canonical)) return values;
+  return [...values, canonical];
+}
+function CatalogValueList({ addLabel, catalog, onChange, placeholder, values }) {
+  const [custom, setCustom] = useState2("");
+  const seenValues = /* @__PURE__ */ new Set();
+  const options = [];
+  for (const item of catalog) {
+    const value = resourceOptionValue(item);
+    if (value.length === 0 || seenValues.has(value)) continue;
+    seenValues.add(value);
+    options.push({
+      value,
+      label: item.name || value
+    });
+  }
+  const labelByValue = new Map(options.map((option) => [option.value, option.label]));
+  const catalogLabelFor = (value) => labelByValue.get(value) ?? labelByValue.get(toSettingsResourcePath(value));
+  const available = options.filter((option) => !settingsResourceListIncludes(values, option.value));
+  const addCustom = () => {
+    const trimmed = custom.trim();
+    if (!trimmed) return;
+    onChange(addUniqueSettingsResource(values, trimmed));
+    setCustom("");
+  };
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-1.5",
+    children: [values.length === 0 ? /* @__PURE__ */ jsx("p", {
+      className: "px-1 py-2 text-xs text-pretty text-muted-foreground",
+      children: "Nothing selected yet."
+    }) : values.map((value) => {
+      const catalogLabel = catalogLabelFor(value);
+      return /* @__PURE__ */ jsx(ItemRow, {
+        interactive: false,
+        title: catalogLabel ?? value,
+        subtitle: catalogLabel && catalogLabel !== value ? value : void 0,
+        trailing: /* @__PURE__ */ jsx(Button$1, {
+          type: "button",
+          variant: "ghost",
+          size: "icon-compact",
+          "aria-label": `Remove ${value}`,
+          onClick: () => onChange(values.filter((entry) => entry !== value)),
+          children: /* @__PURE__ */ jsx(Trash, {})
+        })
+      }, value);
+    }), available.length > 0 ? /* @__PURE__ */ jsx(Select$1, {
+      "aria-label": addLabel,
+      value: null,
+      placeholder: addLabel,
+      options: available,
+      onValueChange: (next) => {
+        if (!next) return;
+        onChange(addUniqueSettingsResource(values, next));
+      }
+    }) : /* @__PURE__ */ jsxs(InputGroup, { children: [/* @__PURE__ */ jsx(InputGroupInput, {
+      "aria-label": addLabel,
+      value: custom,
+      onChange: (event) => setCustom(event.target.value),
+      onKeyDown: (event) => {
+        if (event.key === "Enter") {
+          event.preventDefault();
+          addCustom();
+        }
+      },
+      placeholder
+    }), /* @__PURE__ */ jsx(InputGroupAddon, {
+      align: "inline-end",
+      children: /* @__PURE__ */ jsxs(InputGroupButton, {
+        onClick: addCustom,
+        disabled: !custom.trim(),
+        children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add"]
+      })
+    })] })]
+  });
+}
+function ResourcesSection({ draft, onEnableSkillCommandsChange, onExtensionsChange, onPackageRowsChange, onPromptsChange, onRevert, onSave, onSkillsChange, onThemesChange, packageError, packageRows, resourceDirty, resources, resourceSummary, saving, scope = "harness", settingsLoading, updateDraft }) {
+  const disabled = !draft || settingsLoading || !!packageError;
+  const catalogSubtitle = resourceSummary.total === 0 ? "Empty" : resourceSummary.reloadRequired > 0 ? `${resourceSummary.total} \xB7 ${resourceSummary.reloadRequired} reload` : `${resourceSummary.total}`;
+  return /* @__PURE__ */ jsx(SettingsPane, {
+    title: scope === "skills" ? "Skills" : "Pi Harness",
+    description: scope === "skills" ? "Pick detected workspace skills and slash-command discovery." : "Runtime (compaction, retry, transport) plus packages, extensions, prompts, and themes.",
+    actions: /* @__PURE__ */ jsx(SettingsCommitActions, {
+      dirty: resourceDirty,
+      disabled,
+      onRevert,
+      onSave,
+      saving
+    }),
+    children: scope === "skills" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(ItemRow, {
+      title: "Skill slash commands",
+      trailing: /* @__PURE__ */ jsx(Switch$1, {
+        "aria-label": "Skill slash commands",
+        checked: draft?.enableSkillCommands ?? true,
+        disabled: !draft,
+        onCheckedChange: onEnableSkillCommandsChange
+      })
+    }), /* @__PURE__ */ jsx(ResourceGroup, {
+      label: "Skills",
+      count: draft?.skills.length ?? 0,
+      children: /* @__PURE__ */ jsx(CatalogValueList, {
+        addLabel: "Add skill",
+        catalog: resources?.skills ?? [],
+        placeholder: "../agent-workspace/pi/skills",
+        values: draft?.skills ?? [],
+        onChange: onSkillsChange
+      })
+    })] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+      /* @__PURE__ */ jsx(HarnessRuntimeSection, {
+        draft,
+        updateDraft
+      }),
+      /* @__PURE__ */ jsx(ItemRow, {
+        interactive: false,
+        title: "Catalog",
+        subtitle: /* @__PURE__ */ jsx("span", {
+          className: "tabular-nums",
+          children: catalogSubtitle
+        })
+      }),
+      /* @__PURE__ */ jsxs(ResourceGroup, {
+        label: "Packages",
+        count: packageRows.length,
+        children: [/* @__PURE__ */ jsx(CatalogValueList, {
+          addLabel: "Add package",
+          catalog: resources?.packages ?? [],
+          placeholder: 'npm:pi-skills or {"source":"npm:pkg"}',
+          values: packageRows,
+          onChange: onPackageRowsChange
+        }), packageError ? /* @__PURE__ */ jsx("p", {
+          className: "px-1 text-xs text-destructive",
+          children: packageError
+        }) : null]
+      }),
+      /* @__PURE__ */ jsx(ResourceGroup, {
+        label: "Extensions",
+        count: draft?.extensions.length ?? 0,
+        children: /* @__PURE__ */ jsx(CatalogValueList, {
+          addLabel: "Add extension",
+          catalog: resources?.extensions ?? [],
+          placeholder: "../agent-workspace/pi/extensions",
+          values: draft?.extensions ?? [],
+          onChange: onExtensionsChange
+        })
+      }),
+      /* @__PURE__ */ jsx(ResourceGroup, {
+        label: "Prompts",
+        count: draft?.prompts.length ?? 0,
+        children: /* @__PURE__ */ jsx(CatalogValueList, {
+          addLabel: "Add prompt",
+          catalog: resources?.prompts ?? [],
+          placeholder: "../agent-workspace/pi/prompts",
+          values: draft?.prompts ?? [],
+          onChange: onPromptsChange
+        })
+      }),
+      /* @__PURE__ */ jsx(ResourceGroup, {
+        label: "Themes",
+        count: draft?.themes.length ?? 0,
+        children: /* @__PURE__ */ jsx(CatalogValueList, {
+          addLabel: "Add theme",
+          catalog: resources?.themes ?? [],
+          placeholder: "../agent-workspace/pi/themes",
+          values: draft?.themes ?? [],
+          onChange: onThemesChange
+        })
+      })
+    ] })
+  });
+}
+function ResourceGroup({ children, count, label }) {
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex flex-col gap-1.5",
+    children: [/* @__PURE__ */ jsxs("div", {
+      className: "flex items-baseline justify-between gap-2 px-1",
+      children: [/* @__PURE__ */ jsx("p", {
+        className: "text-xs font-medium text-muted-foreground",
+        children: label
+      }), /* @__PURE__ */ jsx("p", {
+        className: "text-xs text-muted-foreground tabular-nums",
+        children: count === 1 ? "1 item" : `${count} items`
+      })]
+    }), children]
+  });
+}
+function SandboxProviderSection({ isLoading, isPending, onUpdateProvider, providers }) {
+  const [editing, setEditing] = useState2(false);
+  const [apiKey, setApiKey] = useState2("");
+  const [target, setTarget] = useState2("");
+  const [showPassword, setShowPassword] = useState2(false);
+  const [attemptedSave, setAttemptedSave] = useState2(false);
+  const daytonaProvider = useMemo3(() => providers.find((p) => p.id === "daytona"), [providers]);
+  const daytonaTargetProvider = useMemo3(() => providers.find((p) => p.id === "daytona-target"), [providers]);
+  const isConfigured = Boolean(daytonaProvider?.isConfigured && daytonaTargetProvider?.isConfigured);
+  const resetEditor = () => {
+    setApiKey("");
+    setTarget("");
+    setShowPassword(false);
+    setAttemptedSave(false);
+  };
+  const closeEditor = () => {
+    setEditing(false);
+    resetEditor();
+  };
+  const handleSave = async () => {
+    if (!onUpdateProvider) return;
+    setAttemptedSave(true);
+    if (!apiKey.trim() && !target.trim()) return;
+    try {
+      if (apiKey.trim()) await onUpdateProvider({
+        providerId: "daytona",
+        apiKey: apiKey.trim()
+      });
+      if (target.trim()) await onUpdateProvider({
+        providerId: "daytona-target",
+        apiKey: target.trim()
+      });
+      notify.success("Sandbox Provider updated successfully");
+      closeEditor();
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Failed to update provider");
+    }
+  };
+  const canSave = apiKey.trim().length > 0 || target.trim().length > 0;
+  return /* @__PURE__ */ jsx(SettingsPane, {
+    title: "Sandbox",
+    description: "Configure isolated execution environments.",
+    children: isLoading ? /* @__PURE__ */ jsxs("div", {
+      className: "flex items-center justify-center gap-2 py-6 text-xs text-muted-foreground",
+      children: [/* @__PURE__ */ jsx(Spinner, {}), /* @__PURE__ */ jsx("span", { children: "Loading\u2026" })]
+    }) : /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col",
+      children: [/* @__PURE__ */ jsx(ItemRow, {
+        interactive: false,
+        icon: /* @__PURE__ */ jsx(HardDrive, { className: "size-4 text-foreground/80" }),
+        title: "Daytona",
+        subtitle: "DAYTONA_API_KEY \xB7 DAYTONA_TARGET",
+        trailing: /* @__PURE__ */ jsx(Button$1, {
+          type: "button",
+          variant: "ghost",
+          size: "compact",
+          className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs transition-[background-color,transform] duration-150 active:scale-[0.96]"),
+          onClick: () => {
+            if (editing) {
+              closeEditor();
+              return;
+            }
+            setEditing(true);
+            resetEditor();
+          },
+          children: editing ? "Cancel" : isConfigured ? "Update" : "Configure"
+        })
+      }), editing ? /* @__PURE__ */ jsxs(RowSurface, {
+        tone: "inset",
+        padding: "md",
+        className: "flex flex-col gap-2 border-t border-border/30",
+        children: [
+          /* @__PURE__ */ jsxs(FieldGroup, {
+            className: "gap-2",
+            children: [/* @__PURE__ */ jsx(SecretCredentialField, {
+              attemptedSave,
+              label: "Daytona API key",
+              placeholder: "Enter Daytona API Key\u2026",
+              value: apiKey,
+              showPassword,
+              required: false,
+              onChange: setApiKey,
+              onToggleVisibility: () => setShowPassword((current) => !current)
+            }), /* @__PURE__ */ jsx(TextCredentialField, {
+              attemptedSave,
+              icon: Globe,
+              label: "Region / target",
+              placeholder: "e.g. us-east",
+              value: target,
+              required: false,
+              onChange: setTarget
+            })]
+          }),
+          /* @__PURE__ */ jsxs(Alert, {
+            className: "px-3 py-2",
+            children: [/* @__PURE__ */ jsx(Info, {}), /* @__PURE__ */ jsx(AlertDescription, {
+              className: "text-xs text-pretty",
+              children: "Settings are stored securely in your local environment overrides. Provide at least one value to save."
+            })]
+          }),
+          /* @__PURE__ */ jsx("div", {
+            className: "flex items-center justify-end",
+            children: /* @__PURE__ */ jsxs(Button$1, {
+              type: "button",
+              size: "compact",
+              disabled: isPending || !canSave,
+              onClick: () => void handleSave(),
+              children: [isPending ? /* @__PURE__ */ jsx(Spinner, { "data-icon": "inline-start" }) : null, "Save"]
+            })
+          })
+        ]
+      }) : null]
+    })
+  });
+}
+var SETTINGS_SECTION_REGISTRY = {
+  appearance: {
+    id: "appearance",
+    order: 10,
+    title: "Appearance",
+    ariaLabel: "Appearance settings",
+    icon: Paintbrush,
+    group: "workspace"
+  },
+  chat: {
+    id: "chat",
+    order: 20,
+    title: "Chat",
+    ariaLabel: "Chat settings",
+    icon: MessageSquare,
+    group: "workspace"
+  },
+  mcp: {
+    id: "mcp",
+    order: 25,
+    title: "MCP",
+    ariaLabel: "MCP connection settings",
+    icon: Plug,
+    group: "workspace"
+  },
+  sandbox: {
+    id: "sandbox",
+    order: 30,
+    title: "Sandbox",
+    ariaLabel: "Sandbox settings",
+    icon: HardDrive,
+    group: "advanced"
+  },
+  providers: {
+    id: "providers",
+    order: 40,
+    title: "Providers",
+    ariaLabel: "Provider settings",
+    icon: KeyRound,
+    group: "models"
+  },
+  "llm-models": {
+    id: "llm-models",
+    order: 50,
+    title: "LLM Models",
+    ariaLabel: "LLM model settings",
+    icon: Cpu,
+    group: "models"
+  },
+  skills: {
+    id: "skills",
+    order: 60,
+    title: "Skills",
+    ariaLabel: "Skill settings",
+    icon: Sparkles,
+    group: "advanced"
+  },
+  "pi-harness": {
+    id: "pi-harness",
+    order: 70,
+    title: "Pi Harness",
+    ariaLabel: "Pi harness settings",
+    icon: Settings,
+    group: "advanced"
+  },
+  keybindings: {
+    id: "keybindings",
+    order: 80,
+    title: "Keybindings",
+    ariaLabel: "Keybinding settings",
+    icon: Keyboard,
+    group: "advanced"
+  },
+  sessions: {
+    id: "sessions",
+    order: 90,
+    title: "Sessions",
+    ariaLabel: "Session settings",
+    icon: Users,
+    group: "workspace"
+  }
+};
+var SETTINGS_SECTION_GROUPS = [
+  {
+    id: "workspace",
+    label: "Workspace"
+  },
+  {
+    id: "models",
+    label: "Models"
+  },
+  {
+    id: "advanced",
+    label: "Advanced"
+  }
+];
+var SETTINGS_SECTIONS = Object.values(SETTINGS_SECTION_REGISTRY).sort((left, right) => left.order - right.order);
+function isSettingsSectionId(value) {
+  return SETTINGS_SECTIONS.some((section) => section.id === value);
+}
+function useResourcesForm({ draft, settings, updateDraft }) {
+  const [editedPackageRows, setEditedPackageRows] = useState2(null);
+  const [packageError, setPackageError] = useState2();
+  const derivedPackageRows = useMemo3(() => formatPackageSourceRows(settings?.effective.packages ?? []), [settings?.effective.packages]);
+  const packageRows = editedPackageRows ?? derivedPackageRows;
+  const resourceDirty = !!draft && !!settings && (!sameJson(resourceSettings(draft), resourceSettings(settings.effective)) || !sameJson(harnessSettings(draft), harnessSettings(settings.effective)) || !sameJson(packageRows.filter((row) => row.trim()), formatPackageSourceRows(settings.effective.packages)));
+  const handlePackageRowsChange = (rows) => {
+    setEditedPackageRows(rows);
+    try {
+      const packages = parsePackageSourceRows(rows);
+      setPackageError(void 0);
+      updateDraft((current) => ({
+        ...current,
+        packages
+      }));
+    } catch (error) {
+      setPackageError(error instanceof Error ? error.message : String(error));
+    }
+  };
+  const revertResourceDraft = () => {
+    if (!settings) return;
+    updateDraft((current) => ({
+      ...current,
+      packages: settings.effective.packages,
+      extensions: settings.effective.extensions,
+      skills: settings.effective.skills,
+      prompts: settings.effective.prompts,
+      themes: settings.effective.themes,
+      enableSkillCommands: settings.effective.enableSkillCommands,
+      compaction: settings.effective.compaction,
+      retry: settings.effective.retry,
+      transport: settings.effective.transport,
+      steeringMode: settings.effective.steeringMode,
+      followUpMode: settings.effective.followUpMode
+    }));
+    setEditedPackageRows(null);
+    setPackageError(void 0);
+  };
+  return {
+    packageRows,
+    packageError,
+    resourceDirty,
+    handlePackageRowsChange,
+    revertResourceDraft
+  };
+}
+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, {})
+  });
+}
+function useTouchPrimary() {
+  const [isTouchPrimary, setIsTouchPrimary] = useState2(false);
+  useEffect2(() => {
+    if (typeof window === "undefined") return;
+    const controller = new AbortController();
+    const { signal } = controller;
+    const handleTouch = () => {
+      const hasTouch = "ontouchstart" in window || navigator.maxTouchPoints > 0;
+      const prefersTouch = window.matchMedia("(pointer: coarse)").matches;
+      setIsTouchPrimary(hasTouch && prefersTouch);
+    };
+    window.matchMedia("(pointer: coarse)").addEventListener("change", handleTouch, { signal });
+    window.addEventListener("pointerdown", handleTouch, { signal });
+    handleTouch();
+    return () => controller.abort();
+  }, []);
+  return isTouchPrimary;
+}
+var ScrollAreaContext = createContext4(false);
+var ScrollArea$1 = forwardRef7(({ className, children, viewportClassName, orientation: orientation2 = "vertical", ...props }, ref) => {
+  const isTouch = useTouchPrimary();
+  return /* @__PURE__ */ jsx(ScrollAreaContext.Provider, {
+    value: isTouch,
+    children: isTouch ? /* @__PURE__ */ jsx("div", {
+      ref,
+      role: "group",
+      "data-slot": "scroll-area",
+      "aria-roledescription": "scroll area",
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: /* @__PURE__ */ jsx("div", {
+        "data-slot": "scroll-area-viewport",
+        className: cn("size-full rounded-[inherit]", orientation2 === "vertical" && "overflow-y-auto", orientation2 === "horizontal" && "overflow-x-auto", orientation2 === "both" && "overflow-auto", viewportClassName),
+        tabIndex: 0,
+        children
+      })
+    }) : /* @__PURE__ */ jsxs(index_parts_exports.Root, {
+      ref,
+      "data-slot": "scroll-area",
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(index_parts_exports.Viewport, {
+          "data-slot": "scroll-area-viewport",
+          className: cn("size-full rounded-[inherit]", viewportClassName),
+          children: /* @__PURE__ */ jsx(index_parts_exports.Content, { children })
+        }),
+        orientation2 !== "horizontal" && /* @__PURE__ */ jsx(ScrollBar, { orientation: "vertical" }),
+        orientation2 !== "vertical" && /* @__PURE__ */ jsx(ScrollBar, { orientation: "horizontal" }),
+        orientation2 === "both" && /* @__PURE__ */ jsx(index_parts_exports.Corner, {})
+      ]
+    })
+  });
+});
+ScrollArea$1.displayName = "ScrollArea";
+var ScrollBar = forwardRef7(({ className, orientation: orientation2 = "vertical", ...props }, ref) => {
+  const isTouch = useContext4(ScrollAreaContext);
+  const shape = useShape();
+  if (isTouch) return null;
+  return /* @__PURE__ */ jsx(index_parts_exports.Scrollbar, {
+    ref,
+    orientation: orientation2,
+    "data-slot": "scroll-area-scrollbar",
+    className: cn("group/scrollbar absolute z-20 flex touch-none select-none", "opacity-0 transition-opacity duration-120 ease-out delay-160", "data-[hovering]:duration-160 data-[scrolling]:duration-160", "data-[hovering]:opacity-100 data-[scrolling]:opacity-100", "data-[hovering]:delay-0 data-[scrolling]:delay-0", orientation2 === "vertical" && "top-0 right-0 h-full w-2.5", orientation2 === "horizontal" && "bottom-0 left-0 h-2.5 w-full flex-col", className),
+    ...props,
+    children: /* @__PURE__ */ jsx(index_parts_exports.Thumb, {
+      "data-slot": "scroll-area-thumb",
+      className: cn("relative bg-[rgb(var(--overlay)/0.08)] transition-[background-color,width,height] duration-160 ease-in-out", "group-hover/scrollbar:bg-[rgb(var(--overlay)/0.12)] active:!bg-[rgb(var(--overlay)/0.16)]", shape.bg, orientation2 === "vertical" && "mx-auto my-1 w-1 -translate-x-0.5 h-[var(--scroll-area-thumb-height)] group-hover/scrollbar:w-1.5", orientation2 === "horizontal" && "my-auto mx-1 h-1 -translate-y-0.5 w-[var(--scroll-area-thumb-width)] group-hover/scrollbar:h-1.5")
+    })
+  });
+});
+ScrollBar.displayName = "ScrollBar";
+function useSettingsForm() {
+  const { isLoadingMcp, isLoadingProviders, isUpdatingMcp, isUpdatingProvider, mcpConnections = [], modelCatalog, onDiscoverModels, onMcpOAuth, onOAuthLogin, onRemoveMcp, onRemoveProvider, onThemePreferenceChange, onUpdateMcp, onUpdateProvider, providers = [], saveSettings, settings, settingsLoading, themePreference } = useSettingsActionsContext();
+  const { models, resources } = useChatPanelDataContext();
+  const [draft, setDraft] = useState2(null);
+  const [savingSection, setSavingSection] = useState2(null);
+  const resourceSummary = summarizeResources(resources);
+  const updateDraft = (updater) => {
+    setDraft((current) => current ? updater(current) : current);
+  };
+  const { packageRows, packageError, resourceDirty, handlePackageRowsChange, revertResourceDraft } = useResourcesForm({
+    draft,
+    settings,
+    updateDraft
+  });
+  const { modelFilter, setModelFilter, modelOptions, modelDirty, addModels, removeModel, setDefaultModel, discoverProvider, discoveringProviderId, commitModelSettings, revertModelDraft, resetCommittedModelBaseline } = useModelDefaultsForm({
+    draft,
+    setDraft,
+    updateDraft,
+    settings,
+    providers,
+    models,
+    modelCatalog,
+    onDiscoverModels,
+    saveSettings,
+    setSavingSection
+  });
+  const hasUnsavedChanges = modelDirty || resourceDirty;
+  const resetDraft = () => {
+    if (!settings) return;
+    setDraft(settings.effective);
+  };
+  useEffect2(() => {
+    if (!settings) return;
+    const nextDraft = settings.effective;
+    if (draft && hasUnsavedChanges) return;
+    if (draft && sameJson(draft, nextDraft)) return;
+    setDraft(nextDraft);
+  }, [
+    draft,
+    hasUnsavedChanges,
+    settings
+  ]);
+  const saveSection = async (section, update) => {
+    if (section === "models" && draft) {
+      if (!await commitModelSettings(draft)) throw new Error("Settings save failed");
+      return;
+    }
+    setSavingSection(section);
+    try {
+      await saveSettings(update);
+      notify.success("Pi settings saved");
+    } catch (error) {
+      notify.error(error instanceof Error ? error.message : "Settings save failed");
+      throw error;
+    } finally {
+      setSavingSection(null);
+    }
+  };
+  const requestCloseSettings = async () => {
+    if (savingSection === "models") return "wait";
+    if (resourceDirty) return "discard-prompt";
+    if (modelDirty && draft) return await commitModelSettings(draft, { silent: true }) ? "close" : "discard-prompt";
+    return "close";
+  };
+  return {
+    isLoadingMcp,
+    isLoadingProviders,
+    isUpdatingMcp,
+    isUpdatingProvider,
+    mcpConnections,
+    onMcpOAuth,
+    onOAuthLogin,
+    onRemoveMcp,
+    onRemoveProvider,
+    onThemePreferenceChange,
+    onUpdateMcp,
+    onUpdateProvider,
+    providers,
+    resources,
+    settingsLoading,
+    themePreference,
+    draft,
+    savingSection,
+    packageRows,
+    packageError,
+    modelFilter,
+    setModelFilter,
+    resourceSummary,
+    modelOptions,
+    modelDirty,
+    resourceDirty,
+    revertResourceDraft,
+    revertModelDraft,
+    resetDraft,
+    updateDraft,
+    handlePackageRowsChange,
+    addModels,
+    removeModel,
+    setDefaultModel,
+    discoverProvider,
+    discoveringProviderId,
+    saveSection,
+    requestCloseSettings,
+    resetCommittedModelBaseline
+  };
+}
+function SettingsNavItem({ active, onClick, icon: Icon, label }) {
+  return /* @__PURE__ */ jsxs("button", {
+    type: "button",
+    onClick,
+    className: cn("flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-left text-label transition-colors", active ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:bg-muted hover:text-foreground"),
+    children: [/* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0" }), /* @__PURE__ */ jsx("span", { children: label })]
+  });
+}
+function SettingsDialog({ open, onOpenChange, initialTab }) {
+  useEffect2(() => {
+    applyUiPreferencesToDocument(readUiPreferences());
+  }, []);
+  return /* @__PURE__ */ jsx(SettingsDialogSession, {
+    initialTab,
+    onOpenChange,
+    open
+  });
+}
+function SettingsDialogSession({ initialTab, onOpenChange, open }) {
+  const onCloseAttemptRef = useRef4(() => {
+    onOpenChange(false);
+  });
+  return /* @__PURE__ */ jsx(Dialog$1, {
+    open,
+    onOpenChange: (nextOpen, eventDetails) => {
+      if (nextOpen) {
+        onOpenChange(true);
+        return;
+      }
+      onCloseAttemptRef.current(eventDetails);
+    },
+    children: open ? /* @__PURE__ */ jsx(SettingsDialogBody, {
+      initialTab,
+      onCloseAttemptRef,
+      onOpenChange
+    }) : null
+  });
+}
+function SettingsDialogPaneContent({ activeTab, composerIntent, form, onComposerIntentChange, onComposerIntentKeyChange, preferences, updatePreference }) {
+  const { isLoadingMcp, isLoadingProviders, isUpdatingMcp, isUpdatingProvider, mcpConnections, onMcpOAuth, onOAuthLogin, onRemoveMcp, onRemoveProvider, onThemePreferenceChange, onUpdateMcp, onUpdateProvider, providers, resources, settingsLoading, themePreference, draft, savingSection, packageRows, packageError, modelFilter, setModelFilter, resourceSummary, modelOptions, modelDirty, resourceDirty, revertResourceDraft, revertModelDraft, updateDraft, handlePackageRowsChange, addModels, removeModel, setDefaultModel, discoverProvider, discoveringProviderId, saveSection } = form;
+  const resourcesPane = (scope) => /* @__PURE__ */ jsx(ResourcesSection, {
+    scope,
+    draft,
+    updateDraft,
+    onEnableSkillCommandsChange: (enableSkillCommands) => updateDraft((current) => ({
+      ...current,
+      enableSkillCommands
+    })),
+    onExtensionsChange: (extensions) => updateDraft((current) => ({
+      ...current,
+      extensions
+    })),
+    onPackageRowsChange: handlePackageRowsChange,
+    onPromptsChange: (prompts) => updateDraft((current) => ({
+      ...current,
+      prompts
+    })),
+    onRevert: revertResourceDraft,
+    onSave: () => draft && saveSection("resources", {
+      ...resourceSettings(draft),
+      ...scope === "harness" ? harnessSettings(draft) : {}
+    }),
+    onSkillsChange: (skills) => updateDraft((current) => ({
+      ...current,
+      skills
+    })),
+    onThemesChange: (themes) => updateDraft((current) => ({
+      ...current,
+      themes
+    })),
+    packageError,
+    packageRows,
+    resourceDirty,
+    resources,
+    resourceSummary,
+    saving: savingSection === "resources",
+    settingsLoading
+  });
+  return {
+    appearance: () => /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-4",
+      children: [
+        /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
+          className: "text-lg font-medium",
+          children: "Appearance"
+        }), /* @__PURE__ */ jsx("p", {
+          className: "text-sm text-muted-foreground",
+          children: "Customize the look and feel of the interface."
+        })] }),
+        /* @__PURE__ */ jsx(PersonalizationSection, {
+          onThemePreferenceChange,
+          themePreference
+        }),
+        /* @__PURE__ */ jsx(SettingsRow, {
+          label: "Density",
+          description: "Adjust spacing across chat and panels.",
+          children: /* @__PURE__ */ jsx(Select$1, {
+            "aria-label": "Density",
+            value: preferences.density,
+            onValueChange: (value) => updatePreference("density", value),
+            options: [{
+              label: "Comfortable",
+              value: "comfortable"
+            }, {
+              label: "Compact",
+              value: "compact"
+            }]
+          })
+        }),
+        /* @__PURE__ */ jsx(SettingsRow, {
+          label: "Motion",
+          description: "Respect the system setting or reduce UI motion.",
+          children: /* @__PURE__ */ jsx(Select$1, {
+            "aria-label": "Motion",
+            value: preferences.motion,
+            onValueChange: (value) => updatePreference("motion", value),
+            options: [{
+              label: "System",
+              value: "system"
+            }, {
+              label: "Reduced",
+              value: "reduced"
+            }]
+          })
+        })
+      ]
+    }),
+    chat: () => /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-4",
+      children: [
+        /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
+          className: "text-lg font-medium",
+          children: "Chat"
+        }), /* @__PURE__ */ jsx("p", {
+          className: "text-sm text-muted-foreground",
+          children: "Control transcript behavior."
+        })] }),
+        /* @__PURE__ */ jsx(SettingsRow, {
+          label: "Streaming transcript",
+          description: "Follow new output or preserve the reading position.",
+          children: /* @__PURE__ */ jsx(Select$1, {
+            "aria-label": "Streaming transcript",
+            value: preferences.transcript,
+            onValueChange: (value) => updatePreference("transcript", value),
+            options: [{
+              label: "Follow output",
+              value: "follow"
+            }, {
+              label: "Manual",
+              value: "manual"
+            }]
+          })
+        }),
+        /* @__PURE__ */ jsx(ComposerIntentSection, {
+          enabled: composerIntent?.enabled ?? false,
+          keySource: composerIntent?.keySource ?? "none",
+          status: composerIntent?.status ?? "unconfigured",
+          onClearKey: () => onComposerIntentKeyChange?.(null),
+          onEnabledChange: onComposerIntentChange,
+          onSaveKey: (apiKey) => onComposerIntentKeyChange?.(apiKey)
+        })
+      ]
+    }),
+    mcp: () => /* @__PURE__ */ jsx(McpConnectionsSection, {
+      connections: mcpConnections,
+      isLoading: isLoadingMcp ?? false,
+      isPending: isUpdatingMcp ?? false,
+      onOAuth: onMcpOAuth,
+      onRemove: onRemoveMcp,
+      onUpsert: onUpdateMcp
+    }),
+    sandbox: () => /* @__PURE__ */ jsx(SandboxProviderSection, {
+      isLoading: isLoadingProviders ?? false,
+      isPending: isUpdatingProvider ?? false,
+      providers,
+      onUpdateProvider
+    }),
+    providers: () => /* @__PURE__ */ jsx(ProviderCredentialsSection, {
+      isLoading: isLoadingProviders ?? false,
+      isPending: isUpdatingProvider ?? false,
+      providers,
+      onOAuthLogin,
+      onRemoveProvider,
+      onUpdateProvider
+    }),
+    "llm-models": () => /* @__PURE__ */ jsx(ModelDefaultsSection, {
+      draft,
+      discoveringProviderId,
+      modelDirty,
+      modelFilter,
+      modelOptions,
+      onAddModels: addModels,
+      onDiscoverProvider: discoverProvider,
+      onModelFilterChange: setModelFilter,
+      onRemoveModel: removeModel,
+      onSetDefaultModel: setDefaultModel,
+      providers,
+      onRevert: revertModelDraft,
+      onSave: () => draft && saveSection("models", modelSettings(draft)),
+      saving: savingSection === "models",
+      settingsLoading
+    }),
+    skills: () => resourcesPane("skills"),
+    "pi-harness": () => resourcesPane("harness"),
+    keybindings: () => /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-4 text-sm",
+      children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
+        className: "text-lg font-medium",
+        children: "Keybindings"
+      }), /* @__PURE__ */ jsx("p", {
+        className: "text-sm text-muted-foreground",
+        children: "Every shortcut also has a visible control in the header, panel, or composer."
+      })] }), /* @__PURE__ */ jsxs("div", {
+        className: "rounded-xl border p-4 font-mono text-xs leading-7",
+        children: [
+          /* @__PURE__ */ jsx("div", { children: "Command palette: Ctrl/Command K" }),
+          /* @__PURE__ */ jsx("div", { children: "Conversation sidebar: Ctrl/Command B" }),
+          /* @__PURE__ */ jsx("div", { children: "Toggle Resources: Ctrl/Command Shift 1" }),
+          /* @__PURE__ */ jsx("div", { children: "Toggle Workspace: Ctrl/Command Shift 2" }),
+          /* @__PURE__ */ jsx("div", { children: "Toggle Artifacts: Ctrl/Command Shift 3" }),
+          /* @__PURE__ */ jsx("div", { children: "Focus active panel: Ctrl/Command Shift P" }),
+          /* @__PURE__ */ jsx("div", { children: "Return focus to chat: Ctrl/Command Shift C" }),
+          /* @__PURE__ */ jsx("div", { children: "Close active panel: Escape" })
+        ]
+      })]
+    }),
+    sessions: () => /* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-4",
+      children: [
+        /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
+          className: "text-lg font-medium",
+          children: "Sessions"
+        }), /* @__PURE__ */ jsx("p", {
+          className: "text-sm text-muted-foreground",
+          children: "Set local conversation preferences. Provider and workspace configuration remains Fleet Prime-owned."
+        })] }),
+        /* @__PURE__ */ jsx(SettingsRow, {
+          label: "Confirm session deletion",
+          description: "Require confirmation before deleting a saved conversation.",
+          children: /* @__PURE__ */ jsx(Switch$1, {
+            checked: preferences.confirmSessionDelete,
+            onCheckedChange: (checked) => updatePreference("confirmSessionDelete", checked),
+            "aria-label": "Confirm session deletion"
+          })
+        }),
+        /* @__PURE__ */ jsx("p", {
+          className: "text-xs text-muted-foreground",
+          children: "Provider credentials, OAuth, models, sandbox configuration, and workspace selection are managed by Fleet Prime and its CLI."
+        })
+      ]
+    })
+  }[activeTab]();
+}
+function SettingsDialogBody({ initialTab, onCloseAttemptRef, onOpenChange }) {
+  const form = useSettingsForm();
+  const { composerIntent, onComposerIntentChange, onComposerIntentKeyChange } = useSettingsActionsContext();
+  const { resourceDirty, revertResourceDraft, resetDraft, requestCloseSettings, resetCommittedModelBaseline } = form;
+  const [activeTab, setActiveTab] = useState2(() => initialTab ?? "appearance");
+  const [preferences, setPreferences] = useState2(readUiPreferences);
+  useEffect2(() => {
+    writeUiPreferences(preferences);
+  }, [preferences]);
+  const updatePreference = (key, value) => {
+    setPreferences((current) => ({
+      ...current,
+      [key]: value
+    }));
+  };
+  const [discardDialogOpen, setDiscardDialogOpen] = useState2(false);
+  const [discardReason, setDiscardReason] = useState2("resource");
+  const activeSection = SETTINGS_SECTIONS.find((section) => section.id === activeTab) ?? SETTINGS_SECTIONS[0];
+  const handleOpenChange = (nextOpen, eventDetails) => {
+    if (nextOpen) {
+      onOpenChange(true);
+      return;
+    }
+    eventDetails?.cancel();
+    (async () => {
+      const result = await requestCloseSettings();
+      if (result === "close") {
+        onOpenChange(false);
+        return;
+      }
+      if (result === "wait") {
+        notify.message("Saving model list\u2026");
+        return;
+      }
+      setDiscardReason(resourceDirty ? "resource" : "model");
+      setDiscardDialogOpen(true);
+    })();
+  };
+  onCloseAttemptRef.current = (eventDetails) => {
+    handleOpenChange(false, eventDetails);
+  };
+  const handleDiscardChanges = () => {
+    revertResourceDraft();
+    resetDraft();
+    resetCommittedModelBaseline();
+    setDiscardDialogOpen(false);
+    onOpenChange(false);
+  };
+  useEffect2(() => {
+    resetCommittedModelBaseline();
+  }, [resetCommittedModelBaseline]);
+  const paneContent = /* @__PURE__ */ jsx(SettingsDialogPaneContent, {
+    activeTab,
+    composerIntent,
+    form,
+    onComposerIntentChange,
+    onComposerIntentKeyChange,
+    preferences,
+    updatePreference
+  });
+  return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(DialogContent, {
+    className: "flex h-[min(640px,calc(100dvh-4rem))] w-full max-w-[calc(100%-2rem)] overflow-hidden rounded-2xl p-0 sm:max-w-[min(860px,calc(100%-2rem))]",
+    children: [
+      /* @__PURE__ */ jsx(DialogTitle, {
+        className: "sr-only",
+        children: "Settings"
+      }),
+      /* @__PURE__ */ jsx(DialogDescription, {
+        className: "sr-only",
+        children: "Customize your settings here."
+      }),
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex h-full min-h-0 min-w-0",
+        children: [/* @__PURE__ */ jsxs("nav", {
+          "aria-label": "Settings sections",
+          className: "hidden h-full w-52 shrink-0 flex-col border-r border-border bg-sidebar sm:flex",
+          children: [/* @__PURE__ */ jsx("div", {
+            className: "px-6 pt-6 pb-2 text-label font-semibold",
+            children: "Settings"
+          }), /* @__PURE__ */ jsx("div", {
+            className: "min-h-0 flex-1 overflow-y-auto px-2 pb-6",
+            children: SETTINGS_SECTION_GROUPS.map((group) => /* @__PURE__ */ jsxs("div", {
+              className: "py-2",
+              children: [/* @__PURE__ */ jsx("p", {
+                className: "px-2 pb-1 text-caption font-medium uppercase tracking-wide text-muted-foreground",
+                children: group.label
+              }), /* @__PURE__ */ jsx("div", {
+                className: "flex flex-col gap-0.5",
+                children: SETTINGS_SECTIONS.filter((section) => section.group === group.id).map((section) => /* @__PURE__ */ jsx(SettingsNavItem, {
+                  active: activeTab === section.id,
+                  onClick: () => setActiveTab(section.id),
+                  icon: section.icon,
+                  label: section.title
+                }, section.id))
+              })]
+            }, group.id))
+          })]
+        }), /* @__PURE__ */ jsxs("main", {
+          className: "flex h-full min-h-0 min-w-0 flex-1 flex-col overflow-hidden",
+          children: [
+            /* @__PURE__ */ jsx("header", {
+              className: "flex h-14 shrink-0 items-center gap-2 border-b border-border/10 px-6",
+              children: /* @__PURE__ */ jsx("div", {
+                className: "flex flex-1 items-center justify-between",
+                children: /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsxs(BreadcrumbList, { children: [
+                  /* @__PURE__ */ jsx(BreadcrumbItem, {
+                    className: "hidden sm:block",
+                    children: "Settings"
+                  }),
+                  /* @__PURE__ */ jsx(BreadcrumbSeparator, { className: "hidden sm:block" }),
+                  /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbPage, { children: activeSection.title }) })
+                ] }) })
+              })
+            }),
+            /* @__PURE__ */ jsx("div", {
+              className: "shrink-0 border-b border-border/10 bg-muted/5 px-4 py-2.5 sm:hidden",
+              children: /* @__PURE__ */ jsx(Select$1, {
+                "aria-label": "Settings sections",
+                value: activeTab,
+                onValueChange: (next) => {
+                  if (isSettingsSectionId(next)) setActiveTab(next);
+                },
+                options: SETTINGS_SECTIONS.map((section) => ({
+                  label: section.title,
+                  value: section.id
+                }))
+              })
+            }),
+            /* @__PURE__ */ jsx(ScrollArea$1, {
+              className: "min-h-0 flex-1",
+              children: /* @__PURE__ */ jsx("div", {
+                id: `panel-${activeTab}`,
+                role: "tabpanel",
+                "aria-label": activeSection.title,
+                tabIndex: 0,
+                className: "p-6 outline-none",
+                children: paneContent
+              })
+            })
+          ]
+        })]
+      })
+    ]
+  }), /* @__PURE__ */ jsx(AlertDialog$1, {
+    open: discardDialogOpen,
+    onOpenChange: setDiscardDialogOpen,
+    children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs("div", {
+      className: "flex flex-col gap-2",
+      children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: "Discard unsaved changes?" }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: discardReason === "resource" ? "Your resource changes have not been committed. If you leave settings now, those changes will be lost." : "Your model list could not be saved. If you leave settings now, those changes will be lost." })]
+    }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, { children: "Keep editing" }), /* @__PURE__ */ jsx(AlertDialogAction, {
+      onClick: handleDiscardChanges,
+      children: "Discard changes"
+    })] })] })
+  })] });
+}
+export {
+  SettingsDialog
+};