@qredence/fleet 0.6.1 → 0.6.2

package/dist/web/server/{settings-dialog-CK0FJlTg-HZRBAXDZ.js → settings-dialog-BCEfmgtP-T3WQEZHB.js}

@@ -1,3 +1,9 @@
+import {
+  Keyboard,
+  Monitor,
+  Moon,
+  Sun
+} from "./chunk-LJ6Y7DBH.js";
 import {
   AlertDialog,
   AlertDialogAction,
@@ -7,84 +13,67 @@ import {
   AlertDialogFooter,
   AlertDialogTitle,
   ArrowLeft,
-  COMPACT_ACTION_BUTTON_CLASS,
   Cpu,
-  HIT_AREA_EXPAND_CLASS,
-  HIT_AREA_EXPAND_DENSE_CLASS,
   PROVIDER_METADATA,
   ProviderBrandIcon,
   Settings,
   Spinner,
   Trash2,
-  fleetPiRowSurface,
-  formatProviderLabel,
-  getDelay,
-  safePolygon,
-  useHoverFloatingInteraction,
-  useHoverInteractionSharedState,
-  useHoverReferenceInteraction,
-  usePopupHandleStore
-} from "./chunk-2JHTYWD5.js";
-import {
-  UI_PREFERENCES_KEY,
-  isModelPatternEnabled,
-  modelMatchesPattern,
-  modelPattern,
-  readUiPreferences
-} from "./chunk-ETTDO4UO.js";
-import {
-  MessageSquare
-} from "./chunk-GL6HWDJB.js";
+  formatProviderLabel
+} from "./chunk-ZOVXMNJM.js";
 import {
   Pencil
 } from "./chunk-M5RSPNYN.js";
 import {
-  Keyboard,
-  Monitor,
-  Moon,
-  Sun
-} from "./chunk-LJ6Y7DBH.js";
+  COMPACT_ACTION_BUTTON_CLASS,
+  HIT_AREA_EXPAND_CLASS,
+  HIT_AREA_EXPAND_DENSE_CLASS,
+  rowSurface
+} from "./chunk-7HXCGBUP.js";
 import {
+  Plus,
   useChatPanelDataContext,
   useSettingsActionsContext
-} from "./chunk-SALXCFVO.js";
+} from "./chunk-33QA7BQJ.js";
 import {
-  Plus
-} from "./chunk-PVJCTQFK.js";
+  isModelPatternEnabled,
+  modelMatchesPattern,
+  modelPattern
+} from "./chunk-WTYNN6EV.js";
+import {
+  applyUiPreferencesToDocument,
+  readUiPreferences,
+  writeUiPreferences
+} from "./chunk-4EBSM4JR.js";
 import {
   RefreshCw
 } from "./chunk-OKL5ZRVB.js";
 import {
   notify
-} from "./chunk-JTCCQZLN.js";
+} from "./chunk-BUXJSBE3.js";
+import "./chunk-UCA4WN66.js";
 import {
-  FloatingPortalLite,
   Info
-} from "./chunk-UL2725KQ.js";
-import "./chunk-UCA4WN66.js";
+} from "./chunk-IXGLKAPN.js";
 import {
   Eye
 } from "./chunk-2ST2ULW7.js";
 import {
   ExternalLink,
-  Globe
-} from "./chunk-BLSX7WHW.js";
-import {
+  Globe,
   Sparkles
-} from "./chunk-3JMESBAT.js";
+} from "./chunk-OSMP55KI.js";
 import {
   HardDrive
 } from "./chunk-D7ELZVTI.js";
-import {
-  writeStoredValue
-} from "./chunk-SZJUXVWG.js";
+import "./chunk-SZJUXVWG.js";
 import {
   InputGroup,
   InputGroupAddon,
   InputGroupButton,
   InputGroupInput,
   Textarea
-} from "./chunk-NJ4QEZHK.js";
+} from "./chunk-CW6KZUKT.js";
 import {
   Search
 } from "./chunk-JIULUYHT.js";
@@ -105,132 +94,71 @@ import {
   FieldGroup,
   FieldLabel,
   Switch
-} from "./chunk-KP2PNDGL.js";
+} from "./chunk-WB2LJC3R.js";
 import {
   Select,
   clamp,
-  getDisabledMountTransitionStyles,
   normalizeScrollOffset,
   styleDisableScrollbar,
-  useAnchorPositioning,
   useCSPContext,
-  useDirection,
-  usePositioner,
-  useRender
-} from "./chunk-NNKJTKOQ.js";
+  useDirection
+} from "./chunk-6SOMNRAX.js";
 import {
   isCustomProviderId,
   isNamedOccInstanceId,
   isOccProviderId
 } from "./chunk-RJOANOT4.js";
-import "./chunk-WWJF4RO2.js";
 import {
   Input
-} from "./chunk-5UCAJBAH.js";
+} from "./chunk-43S5N7SH.js";
 import {
   Dialog,
-  DialogBackdrop,
-  DialogClose,
   DialogContent,
   DialogDescription,
-  DialogDescription$1,
   DialogHeader,
-  DialogPopup,
-  DialogPortal$1,
-  DialogRoot,
-  DialogTitle,
-  DialogTitle$1,
-  FOCUSABLE_POPUP_PROPS,
-  PopupHandleAttachment,
-  PopupTriggerMap,
-  SurfaceProvider,
-  applyPopupOpenChange,
-  createInitialPopupStoreState,
-  createPopupFloatingRootContext,
-  isMouseLikePointerType,
-  popupStateMapping,
-  popupStoreSelectors,
-  popupTransitionStateMapping,
-  surfaceClasses,
-  triggerOpenStateMapping,
-  useDismiss,
-  useImplicitActiveTrigger,
-  useOpenStateTransitions,
-  usePopupInteractionProps,
-  usePopupRootStore,
-  useSurface,
-  useTriggerDataForwarding
-} from "./chunk-4WBFCB4O.js";
+  DialogTitle
+} from "./chunk-JVOW2NWC.js";
 import {
   Button,
-  POPUP_COLLISION_AVOIDANCE,
-  ReactStore,
-  Timeout,
-  activeElement,
   contains,
-  createAttribute,
-  cva,
-  fastComponent,
-  fastComponentRef,
   getTarget,
-  isTargetInsideEnabledTrigger,
-  isTypeableElement,
-  mac,
-  matchesFocusVisible,
-  mergeCleanups,
-  ownerDocument,
   useTimeout,
   webkit
-} from "./chunk-WNCAL4HN.js";
+} from "./chunk-HQ5TEXHT.js";
+import "./chunk-TLNZNR7C.js";
 import {
   Check
 } from "./chunk-4QD4PCVP.js";
-import "./chunk-S3PQ6HKH.js";
-import {
-  useBaseUiId,
-  useValueAsRef
-} from "./chunk-MNBGB2SP.js";
+import "./chunk-JBLHIEVG.js";
+import "./chunk-WWJF4RO2.js";
+import "./chunk-OVJYUWSQ.js";
 import {
-  X
-} from "./chunk-JBLHIEVG.js";
+  useBaseUiId
+} from "./chunk-E5HALE4M.js";
 import {
-  EMPTY_OBJECT,
   addEventListener,
-  createChangeEventDetails,
-  disabled,
   formatErrorMessage,
-  getWindow,
-  imperativeAction,
-  isElement,
-  isHTMLElement,
-  mergeProps,
-  none,
-  triggerFocus,
-  triggerHover,
-  triggerPress,
   useIsoLayoutEffect,
-  useOpenChangeComplete,
   useRenderElement,
   useStableCallback
-} from "./chunk-XIB6XNUX.js";
+} from "./chunk-XJ6TGSUB.js";
 import {
   Plug
 } from "./chunk-AHTO6GDS.js";
-import "./chunk-EAJTWMK5.js";
 import "./chunk-HFQZLPU2.js";
 import {
   createLucideIcon
 } from "./chunk-4ZIEVI5O.js";
 import {
   cn
-} from "./chunk-DJMHPJBP.js";
+} from "./chunk-CHEC7TWB.js";
 import "./chunk-JDCCC7A7.js";
 import "./chunk-L547YHC4.js";
 import "./chunk-MLKGABMK.js";
 
-// web/app/dist/server/assets/settings-dialog-CK0FJlTg.js
+// web/app/dist/server/assets/settings-dialog-BCEfmgtP.js
 import * as React$1 from "react";
-import { useCallback as useCallback2, useEffect as useEffect2, useId, useMemo as useMemo2, useRef as useRef2, useState as useState2 } from "react";
+import { useCallback, useEffect as useEffect2, useId, useMemo as useMemo2, useRef as useRef2, useState as useState2 } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 var Box = createLucideIcon("box", [
   ["path", {
@@ -300,6 +228,10 @@ var Lock = createLucideIcon("lock", [["rect", {
   d: "M7 11V7a5 5 0 0 1 10 0v4",
   key: "fwvmzm"
 }]]);
+var MessageSquare = createLucideIcon("message-square", [["path", {
+  d: "M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",
+  key: "18887p"
+}]]);
 var Paintbrush = createLucideIcon("paintbrush", [
   ["path", {
     d: "m14.622 17.897-10.68-2.913",
@@ -362,366 +294,6 @@ var Users = createLucideIcon("users", [
     key: "nufk8"
   }]
 ]);
-var FloatingDelayGroupContext = /* @__PURE__ */ React$1.createContext({
-  hasProvider: false,
-  timeoutMs: 0,
-  delayRef: { current: 0 },
-  initialDelayRef: { current: 0 },
-  timeout: new Timeout(),
-  currentIdRef: { current: null },
-  currentContextRef: { current: null }
-});
-function resetDelayRef(delayRef, initialDelayRef) {
-  delayRef.current = initialDelayRef.current;
-}
-function useDelayGroup(context, options = { open: false }) {
-  const { open } = options;
-  const store = "rootStore" in context ? context.rootStore : context;
-  const floatingId = store.useState("floatingId");
-  const { currentIdRef, delayRef, timeoutMs, initialDelayRef, currentContextRef, hasProvider, timeout } = React$1.useContext(FloatingDelayGroupContext);
-  const [isInstantPhase, setIsInstantPhase] = React$1.useState(false);
-  const openRef = React$1.useRef(open);
-  useIsoLayoutEffect(() => {
-    openRef.current = open;
-  }, [open]);
-  useIsoLayoutEffect(() => {
-    function unset() {
-      currentContextRef.current?.setIsInstantPhase(false);
-      currentIdRef.current = null;
-      currentContextRef.current = null;
-      delayRef.current = initialDelayRef.current;
-      timeout.clear();
-    }
-    if (!currentIdRef.current) return;
-    if (!open && currentIdRef.current === floatingId) {
-      setIsInstantPhase(false);
-      if (timeoutMs) {
-        const closingId = floatingId;
-        timeout.start(timeoutMs, () => {
-          if (store.select("open") || currentIdRef.current && currentIdRef.current !== closingId) return;
-          unset();
-        });
-        return () => {
-          if (openRef.current || currentIdRef.current !== closingId) timeout.clear();
-        };
-      }
-      unset();
-    }
-  }, [
-    open,
-    floatingId,
-    currentIdRef,
-    delayRef,
-    timeoutMs,
-    initialDelayRef,
-    currentContextRef,
-    timeout,
-    store
-  ]);
-  useIsoLayoutEffect(() => {
-    if (!open) return;
-    const prevContext = currentContextRef.current;
-    const prevId = currentIdRef.current;
-    timeout.clear();
-    currentContextRef.current = {
-      onOpenChange: store.setOpen,
-      setIsInstantPhase
-    };
-    currentIdRef.current = floatingId;
-    delayRef.current = {
-      open: 0,
-      close: getDelay(initialDelayRef.current, "close")
-    };
-    if (prevId !== null && prevId !== floatingId) {
-      setIsInstantPhase(true);
-      prevContext?.setIsInstantPhase(true);
-      prevContext?.onOpenChange(false, createChangeEventDetails(none));
-    } else {
-      setIsInstantPhase(false);
-      prevContext?.setIsInstantPhase(false);
-    }
-  }, [
-    open,
-    floatingId,
-    store,
-    currentIdRef,
-    delayRef,
-    initialDelayRef,
-    currentContextRef,
-    timeout
-  ]);
-  useIsoLayoutEffect(() => {
-    return () => {
-      if (currentIdRef.current === floatingId) {
-        currentContextRef.current = null;
-        if (!openRef.current) return;
-        currentIdRef.current = null;
-        resetDelayRef(delayRef, initialDelayRef);
-        timeout.clear();
-      }
-    };
-  }, [
-    currentContextRef,
-    currentIdRef,
-    delayRef,
-    floatingId,
-    initialDelayRef,
-    timeout
-  ]);
-  return React$1.useMemo(() => ({
-    hasProvider,
-    delayRef,
-    isInstantPhase
-  }), [
-    hasProvider,
-    delayRef,
-    isInstantPhase
-  ]);
-}
-function createVirtualElement(domElement, data) {
-  let offsetX = null;
-  let offsetY = null;
-  let isAutoUpdateEvent = false;
-  return {
-    contextElement: domElement || void 0,
-    getBoundingClientRect() {
-      const domRect = domElement?.getBoundingClientRect() || {
-        width: 0,
-        height: 0,
-        x: 0,
-        y: 0
-      };
-      const isXAxis = data.axis === "x" || data.axis === "both";
-      const isYAxis = data.axis === "y" || data.axis === "both";
-      const canTrackCursorOnAutoUpdate = ["mouseenter", "mousemove"].includes(data.dataRef.current.openEvent?.type || "") && data.pointerType !== "touch";
-      let width = domRect.width;
-      let height = domRect.height;
-      let x = domRect.x;
-      let y = domRect.y;
-      if (offsetX == null && data.x && isXAxis) offsetX = domRect.x - data.x;
-      if (offsetY == null && data.y && isYAxis) offsetY = domRect.y - data.y;
-      x -= offsetX || 0;
-      y -= offsetY || 0;
-      width = 0;
-      height = 0;
-      if (!isAutoUpdateEvent || canTrackCursorOnAutoUpdate) {
-        width = data.axis === "y" ? domRect.width : 0;
-        height = data.axis === "x" ? domRect.height : 0;
-        x = isXAxis && data.x != null ? data.x : x;
-        y = isYAxis && data.y != null ? data.y : y;
-      } else if (isAutoUpdateEvent && !canTrackCursorOnAutoUpdate) {
-        height = data.axis === "x" ? domRect.height : height;
-        width = data.axis === "y" ? domRect.width : width;
-      }
-      isAutoUpdateEvent = true;
-      return {
-        width,
-        height,
-        x,
-        y,
-        top: y,
-        right: x + width,
-        bottom: y + height,
-        left: x
-      };
-    }
-  };
-}
-function isMouseBasedEvent(event) {
-  return event != null && event.clientX != null;
-}
-function useClientPoint(context, props = {}) {
-  const { enabled = true, axis = "both" } = props;
-  const store = "rootStore" in context ? context.rootStore : context;
-  const open = store.useState("open");
-  const floating = store.useState("floatingElement");
-  const domReference = store.useState("domReferenceElement");
-  const dataRef = store.context.dataRef;
-  const initialRef = React$1.useRef(false);
-  const cleanupListenerRef = React$1.useRef(null);
-  const [pointerType, setPointerType] = React$1.useState();
-  const [reactive, setReactive] = React$1.useState([]);
-  const resetReference = useStableCallback((reference2) => {
-    store.set("positionReference", reference2);
-  });
-  const setReference = useStableCallback((newX, newY, referenceElement) => {
-    if (initialRef.current) return;
-    if (dataRef.current.openEvent && !isMouseBasedEvent(dataRef.current.openEvent)) return;
-    store.set("positionReference", createVirtualElement(referenceElement ?? domReference, {
-      x: newX,
-      y: newY,
-      axis,
-      dataRef,
-      pointerType
-    }));
-  });
-  const handleReferenceEnterOrMove = useStableCallback((event) => {
-    if (!open) setReference(event.clientX, event.clientY, event.currentTarget);
-    else if (!cleanupListenerRef.current) {
-      setReference(event.clientX, event.clientY, event.currentTarget);
-      setReactive([]);
-    }
-  });
-  const openCheck = isMouseLikePointerType(pointerType) ? floating : open;
-  React$1.useEffect(() => {
-    if (!enabled) {
-      resetReference(domReference);
-      return;
-    }
-    if (!openCheck) return;
-    function cleanupListener() {
-      cleanupListenerRef.current?.();
-      cleanupListenerRef.current = null;
-    }
-    const win = getWindow(floating);
-    function handleMouseMove(event) {
-      const target = getTarget(event);
-      if (!contains(floating, target)) setReference(event.clientX, event.clientY);
-      else cleanupListener();
-    }
-    if (!dataRef.current.openEvent || isMouseBasedEvent(dataRef.current.openEvent)) cleanupListenerRef.current = addEventListener(win, "mousemove", handleMouseMove);
-    else resetReference(domReference);
-    return cleanupListener;
-  }, [
-    openCheck,
-    enabled,
-    floating,
-    dataRef,
-    domReference,
-    store,
-    setReference,
-    resetReference,
-    reactive
-  ]);
-  React$1.useEffect(() => () => {
-    store.set("positionReference", null);
-  }, [store]);
-  React$1.useEffect(() => {
-    if (enabled && !floating) initialRef.current = false;
-  }, [enabled, floating]);
-  React$1.useEffect(() => {
-    if (!enabled && open) initialRef.current = true;
-  }, [enabled, open]);
-  const reference = React$1.useMemo(() => {
-    function setPointerTypeRef(event) {
-      setPointerType(event.pointerType);
-    }
-    return {
-      onPointerDown: setPointerTypeRef,
-      onPointerEnter: setPointerTypeRef,
-      onMouseMove: handleReferenceEnterOrMove,
-      onMouseEnter: handleReferenceEnterOrMove
-    };
-  }, [handleReferenceEnterOrMove]);
-  return React$1.useMemo(() => enabled ? {
-    reference,
-    trigger: reference
-  } : {}, [enabled, reference]);
-}
-var isMacSafari = mac && webkit;
-function useFocus(context, props = {}) {
-  const { enabled = true, delay: delay2 } = props;
-  const store = "rootStore" in context ? context.rootStore : context;
-  const { events, dataRef } = store.context;
-  const blockFocusRef = React$1.useRef(false);
-  const blockedReferenceRef = React$1.useRef(null);
-  const keyboardModalityRef = React$1.useRef(true);
-  const timeout = useTimeout();
-  React$1.useEffect(() => {
-    const domReference = store.select("domReferenceElement");
-    if (!enabled) return;
-    const win = getWindow(domReference);
-    function onBlur() {
-      const currentDomReference = store.select("domReferenceElement");
-      if (!store.select("open") && isHTMLElement(currentDomReference) && currentDomReference === activeElement(ownerDocument(currentDomReference))) blockFocusRef.current = true;
-    }
-    function onKeyDown() {
-      keyboardModalityRef.current = true;
-    }
-    function onPointerDown() {
-      keyboardModalityRef.current = false;
-    }
-    return mergeCleanups(addEventListener(win, "blur", onBlur), isMacSafari && addEventListener(win, "keydown", onKeyDown, true), isMacSafari && addEventListener(win, "pointerdown", onPointerDown, true));
-  }, [store, enabled]);
-  React$1.useEffect(() => {
-    if (!enabled) return;
-    function onOpenChangeLocal(details) {
-      if (details.reason === "trigger-press" || details.reason === "escape-key") {
-        const referenceElement = store.select("domReferenceElement");
-        if (isElement(referenceElement)) {
-          blockedReferenceRef.current = referenceElement;
-          blockFocusRef.current = true;
-        }
-      }
-    }
-    events.on("openchange", onOpenChangeLocal);
-    return () => {
-      events.off("openchange", onOpenChangeLocal);
-    };
-  }, [
-    events,
-    enabled,
-    store
-  ]);
-  const reference = React$1.useMemo(() => {
-    function resetBlockedFocus() {
-      blockFocusRef.current = false;
-      blockedReferenceRef.current = null;
-    }
-    return {
-      onMouseLeave() {
-        resetBlockedFocus();
-      },
-      onFocus(event) {
-        const focusTarget = event.currentTarget;
-        if (blockFocusRef.current) {
-          if (blockedReferenceRef.current === focusTarget) return;
-          resetBlockedFocus();
-        }
-        const target = getTarget(event.nativeEvent);
-        if (isElement(target)) {
-          if (isMacSafari && !event.relatedTarget) {
-            if (!keyboardModalityRef.current && !isTypeableElement(target)) return;
-          } else if (!matchesFocusVisible(target)) return;
-        }
-        const movedFromOtherEnabledTrigger = isTargetInsideEnabledTrigger(event.relatedTarget, store.context.triggerElements);
-        const { nativeEvent, currentTarget } = event;
-        const delayValue = typeof delay2 === "function" ? delay2() : delay2;
-        if (store.select("open") && movedFromOtherEnabledTrigger || delayValue === 0 || delayValue === void 0) {
-          store.setOpen(true, createChangeEventDetails(triggerFocus, nativeEvent, currentTarget));
-          return;
-        }
-        timeout.start(delayValue, () => {
-          if (blockFocusRef.current) return;
-          store.setOpen(true, createChangeEventDetails(triggerFocus, nativeEvent, currentTarget));
-        });
-      },
-      onBlur(event) {
-        resetBlockedFocus();
-        const relatedTarget = event.relatedTarget;
-        const nativeEvent = event.nativeEvent;
-        const movedToFocusGuard = isElement(relatedTarget) && relatedTarget.hasAttribute(createAttribute("focus-guard")) && relatedTarget.getAttribute("data-type") === "outside";
-        timeout.start(0, () => {
-          const domReference = store.select("domReferenceElement");
-          const activeEl = activeElement(ownerDocument(domReference));
-          if (!relatedTarget && activeEl === domReference) return;
-          if (contains(dataRef.current.floatingContext?.refs.floating.current, activeEl) || contains(domReference, activeEl) || movedToFocusGuard) return;
-          if (isTargetInsideEnabledTrigger(relatedTarget ?? activeEl, store.context.triggerElements)) return;
-          store.setOpen(false, createChangeEventDetails(triggerFocus, nativeEvent));
-        });
-      }
-    };
-  }, [
-    dataRef,
-    delay2,
-    store,
-    timeout
-  ]);
-  return React$1.useMemo(() => enabled ? {
-    reference,
-    trigger: reference
-  } : {}, [enabled, reference]);
-}
 function Breadcrumb({ className, ...props }) {
   return /* @__PURE__ */ jsx("nav", {
     "aria-label": "breadcrumb",
@@ -776,16 +348,25 @@ function getOffset(element, prop, axis) {
   if (axis === "x" && prop === "margin") return start * 2;
   return start + parseFloat(styles[`${key}End`]);
 }
+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";
 var attr = (name) => (value) => value ? { [name]: "" } : null;
 var scrollAreaStateAttributesMapping = {
-  hasOverflowX: attr("data-has-overflow-x"),
-  hasOverflowY: attr("data-has-overflow-y"),
-  overflowXStart: attr("data-overflow-x-start"),
-  overflowXEnd: attr("data-overflow-x-end"),
-  overflowYStart: attr("data-overflow-y-start"),
-  overflowYEnd: attr("data-overflow-y-end"),
+  hasOverflowX: attr(hasOverflowX),
+  hasOverflowY: attr(hasOverflowY),
+  overflowXStart: attr(overflowXStart),
+  overflowXEnd: attr(overflowXEnd),
+  overflowYStart: attr(overflowYStart),
+  overflowYEnd: attr(overflowYEnd),
   cornerHidden: () => null
 };
+var scrollAreaCornerHeight = "--scroll-area-corner-height";
+var scrollAreaCornerWidth = "--scroll-area-corner-width";
+var orientation = "data-orientation";
 var DEFAULT_COORDS = {
   x: 0,
   y: 0
@@ -866,7 +447,7 @@ var ScrollAreaRoot = /* @__PURE__ */ React$1.forwardRef(function ScrollAreaRoot2
     activePointerIdRef.current = event.pointerId;
     startYRef.current = event.clientY;
     startXRef.current = event.clientX;
-    currentOrientationRef.current = event.currentTarget.getAttribute("data-orientation");
+    currentOrientationRef.current = event.currentTarget.getAttribute(orientation);
     const viewportEl = viewportRef.current;
     if (viewportEl) {
       startScrollTopRef.current = viewportEl.scrollTop;
@@ -950,8 +531,8 @@ var ScrollAreaRoot = /* @__PURE__ */ React$1.forwardRef(function ScrollAreaRoot2
     },
     style: {
       position: "relative",
-      ["--scroll-area-corner-height"]: `${cornerSize.height}px`,
-      ["--scroll-area-corner-width"]: `${cornerSize.width}px`
+      [scrollAreaCornerHeight]: `${cornerSize.height}px`,
+      [scrollAreaCornerWidth]: `${cornerSize.width}px`
     }
   };
   const element = useRenderElement("div", componentProps, {
@@ -1037,11 +618,17 @@ function normalizeOverflowEdgeThreshold(threshold) {
   };
 }
 var ScrollAreaViewportContext = /* @__PURE__ */ React$1.createContext(void 0);
+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";
+var scrollAreaThumbHeight = "--scroll-area-thumb-height";
+var scrollAreaThumbWidth = "--scroll-area-thumb-width";
 var OVERFLOW_EDGE_VARS = [
-  "--scroll-area-overflow-x-start",
-  "--scroll-area-overflow-x-end",
-  "--scroll-area-overflow-y-start",
-  "--scroll-area-overflow-y-end"
+  scrollAreaOverflowXStart,
+  scrollAreaOverflowXEnd,
+  scrollAreaOverflowYStart,
+  scrollAreaOverflowYEnd
 ];
 var scrollAreaOverflowVarsRegistered = false;
 function removeCSSVariableInheritance() {
@@ -1135,12 +722,12 @@ var ScrollAreaViewport = /* @__PURE__ */ React$1.forwardRef(function ScrollAreaV
       height: clampedNextHeight
     }));
     if (scrollbarYEl && thumbYEl) {
-      const thumbOffsetY = applyOverscrollThumb(thumbYEl, "--scroll-area-thumb-height", scrollTop, maxScrollTop, scrollableContentHeight, clampedNextHeight, scrollbarYEl.offsetHeight - clampedNextHeight - scrollbarYOffset - thumbYOffset);
+      const thumbOffsetY = applyOverscrollThumb(thumbYEl, scrollAreaThumbHeight, scrollTop, maxScrollTop, scrollableContentHeight, clampedNextHeight, scrollbarYEl.offsetHeight - clampedNextHeight - scrollbarYOffset - thumbYOffset);
       thumbYEl.style.transform = `translate3d(0,${thumbOffsetY}px,0)`;
     }
     if (scrollbarXEl && thumbXEl) {
       const maxThumbOffsetX = scrollbarXEl.offsetWidth - clampedNextWidth - scrollbarXOffset - thumbXOffset;
-      const offsetX = applyOverscrollThumb(thumbXEl, "--scroll-area-thumb-width", direction === "rtl" ? -scrollLeft : scrollLeft, maxScrollLeft, scrollableContentWidth, clampedNextWidth, maxThumbOffsetX);
+      const offsetX = applyOverscrollThumb(thumbXEl, scrollAreaThumbWidth, direction === "rtl" ? -scrollLeft : scrollLeft, maxScrollLeft, scrollableContentWidth, clampedNextWidth, maxThumbOffsetX);
       thumbXEl.style.transform = `translate3d(${direction === "rtl" ? -offsetX : offsetX}px,0,0)`;
     }
     const overflowMetricsPx = [
@@ -1274,14 +861,14 @@ function useScrollAreaScrollbarContext() {
   return context;
 }
 var ScrollAreaScrollbar = /* @__PURE__ */ React$1.forwardRef(function ScrollAreaScrollbar2(componentProps, forwardedRef) {
-  const { render, className, orientation = "vertical", keepMounted = false, style, ...elementProps } = componentProps;
+  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 = orientation === "vertical";
+  const vertical = orientation2 === "vertical";
   const state = {
     ...viewportState,
     hovering,
     scrolling: vertical ? scrollingY : scrollingX,
-    orientation
+    orientation: orientation2
   };
   const direction = useDirection();
   const hideTrackUntilMeasured = !hasMeasuredScrollbar && !keepMounted;
@@ -1322,6 +909,7 @@ var ScrollAreaScrollbar = /* @__PURE__ */ React$1.forwardRef(function ScrollArea
   ]);
   const props = {
     ...rootId && { "data-id": `${rootId}-scrollbar` },
+    "aria-hidden": true,
     onPointerDown(event) {
       if (event.button !== 0) return;
       const target = getTarget(event.nativeEvent);
@@ -1353,6 +941,9 @@ var ScrollAreaScrollbar = /* @__PURE__ */ React$1.forwardRef(function ScrollArea
       });
       handlePointerDown(event);
     },
+    onMouseDown(event) {
+      event.preventDefault();
+    },
     onPointerUp: handlePointerUp,
     onPointerCancel: handlePointerUp,
     style: {
@@ -1363,14 +954,14 @@ var ScrollAreaScrollbar = /* @__PURE__ */ React$1.forwardRef(function ScrollArea
       visibility: hideTrackUntilMeasured ? "hidden" : void 0,
       ...vertical ? {
         top: 0,
-        bottom: "var(--scroll-area-corner-height)",
+        bottom: `var(${scrollAreaCornerHeight})`,
         insetInlineEnd: 0,
-        ["--scroll-area-thumb-height"]: `${thumbSize.height}px`
+        [scrollAreaThumbHeight]: `${thumbSize.height}px`
       } : {
         insetInlineStart: 0,
-        insetInlineEnd: "var(--scroll-area-corner-width)",
+        insetInlineEnd: `var(${scrollAreaCornerWidth})`,
         bottom: 0,
-        ["--scroll-area-thumb-width"]: `${thumbSize.width}px`
+        [scrollAreaThumbWidth]: `${thumbSize.width}px`
       }
     }
   };
@@ -1382,20 +973,20 @@ var ScrollAreaScrollbar = /* @__PURE__ */ React$1.forwardRef(function ScrollArea
   });
   if (!shouldRender) return null;
   return /* @__PURE__ */ jsx(ScrollAreaScrollbarContext.Provider, {
-    value: orientation,
+    value: orientation2,
     children: element
   });
 });
 var ScrollAreaThumb = /* @__PURE__ */ React$1.forwardRef(function ScrollAreaThumb2(componentProps, forwardedRef) {
   const { render, className, style, ...elementProps } = componentProps;
   const { thumbYRef, thumbXRef, handlePointerDown, handlePointerMove, handlePointerUp, scrollingX, scrollingY, hasMeasuredScrollbar } = useScrollAreaRootContext();
-  const orientation = useScrollAreaScrollbarContext();
-  const vertical = orientation === "vertical";
+  const orientation2 = useScrollAreaScrollbarContext();
+  const vertical = orientation2 === "vertical";
   return useRenderElement("div", componentProps, {
     ref: [forwardedRef, vertical ? thumbYRef : thumbXRef],
     state: {
       scrolling: vertical ? scrollingY : scrollingX,
-      orientation
+      orientation: orientation2
     },
     props: [{
       onPointerDown: handlePointerDown,
@@ -1414,13 +1005,16 @@ var ScrollAreaCorner = /* @__PURE__ */ React$1.forwardRef(function ScrollAreaCor
   const { cornerRef, cornerSize, hiddenState } = useScrollAreaRootContext();
   const element = useRenderElement("div", componentProps, {
     ref: [forwardedRef, cornerRef],
-    props: [{ style: {
-      position: "absolute",
-      bottom: 0,
-      insetInlineEnd: 0,
-      width: cornerSize.width,
-      height: cornerSize.height
-    } }, elementProps]
+    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;
@@ -1441,11 +1035,11 @@ function ScrollArea({ className, children, ...props }) {
     ]
   });
 }
-function ScrollBar({ className, orientation = "vertical", ...props }) {
+function ScrollBar({ className, orientation: orientation2 = "vertical", ...props }) {
   return /* @__PURE__ */ jsx(ScrollAreaScrollbar, {
     "data-slot": "scroll-area-scrollbar",
-    "data-orientation": orientation,
-    orientation,
+    "data-orientation": orientation2,
+    orientation: orientation2,
     className: cn("flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent", className),
     ...props,
     children: /* @__PURE__ */ jsx(ScrollAreaThumb, {
@@ -1454,808 +1048,9 @@ function ScrollBar({ className, orientation = "vertical", ...props }) {
     })
   });
 }
-var MOBILE_BREAKPOINT = 768;
-function useIsMobile() {
-  const [isMobile, setIsMobile] = React$1.useState(void 0);
-  React$1.useEffect(() => {
-    const mql = window.matchMedia(`(max-width: 767px)`);
-    const onChange = () => {
-      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    };
-    mql.addEventListener("change", onChange);
-    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-    return () => mql.removeEventListener("change", onChange);
-  }, []);
-  return !!isMobile;
-}
-var SHEET_SURFACE_OFFSET = 4;
-function Sheet({ ...props }) {
-  return /* @__PURE__ */ jsx(DialogRoot, {
-    "data-slot": "sheet",
-    ...props
-  });
-}
-function SheetPortal({ ...props }) {
-  return /* @__PURE__ */ jsx(DialogPortal$1, {
-    "data-slot": "sheet-portal",
-    ...props
-  });
-}
-function SheetOverlay({ className, ...props }) {
-  return /* @__PURE__ */ jsx(DialogBackdrop, {
-    "data-slot": "sheet-overlay",
-    className: cn("fixed inset-0 z-50 bg-black/10 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs", className),
-    ...props
-  });
-}
-function SheetContent({ className, children, side = "right", showCloseButton = true, ...props }) {
-  const substrate = useSurface();
-  const level = Math.min(substrate + SHEET_SURFACE_OFFSET, 8);
-  return /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsx(DialogPopup, {
-    "data-slot": "sheet-content",
-    "data-side": side,
-    className: cn("fixed z-50 flex flex-col gap-4 bg-clip-padding text-sm text-popover-foreground transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", surfaceClasses(level), className),
-    ...props,
-    children: /* @__PURE__ */ jsxs(SurfaceProvider, {
-      value: level,
-      children: [children, showCloseButton && /* @__PURE__ */ jsxs(DialogClose, {
-        "data-slot": "sheet-close",
-        render: /* @__PURE__ */ jsx(Button, {
-          variant: "ghost",
-          className: "absolute top-3 right-3",
-          size: "icon-sm"
-        }),
-        children: [/* @__PURE__ */ jsx(X, {}), /* @__PURE__ */ jsx("span", {
-          className: "sr-only",
-          children: "Close"
-        })]
-      })]
-    })
-  })] });
-}
-function SheetHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx("div", {
-    "data-slot": "sheet-header",
-    className: cn("flex flex-col gap-0.5 p-4", className),
-    ...props
-  });
-}
-function SheetTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx(DialogTitle$1, {
-    "data-slot": "sheet-title",
-    className: cn("font-heading text-base font-medium text-foreground", className),
-    ...props
-  });
-}
-function SheetDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx(DialogDescription$1, {
-    "data-slot": "sheet-description",
-    className: cn("text-sm text-muted-foreground", className),
-    ...props
-  });
-}
-var TooltipRootContext = /* @__PURE__ */ React$1.createContext(void 0);
-function useTooltipRootContext(optional) {
-  const context = React$1.useContext(TooltipRootContext);
-  if (context === void 0 && !optional) throw new Error(formatErrorMessage(72));
-  return context;
-}
-var selectors = {
-  ...popupStoreSelectors,
-  disabled: (state) => state.disabled,
-  instantType: (state) => state.instantType,
-  isInstantPhase: (state) => state.isInstantPhase,
-  trackCursorAxis: (state) => state.trackCursorAxis,
-  disableHoverablePopup: (state) => state.disableHoverablePopup,
-  lastOpenChangeReason: (state) => state.openChangeReason,
-  closeOnClick: (state) => state.closeOnClick,
-  closeDelay: (state) => state.closeDelay,
-  adaptiveOrigin: (state) => state.adaptiveOrigin
-};
-var TooltipStore = class extends ReactStore {
-  constructor(initialState, floatingId, nested) {
-    const triggerElements = new PopupTriggerMap();
-    super(createInitialState(initialState, triggerElements, floatingId, nested), createInitialContext(triggerElements), selectors);
-  }
-  setOpen = (nextOpen, eventDetails) => {
-    applyPopupOpenChange(this, nextOpen, eventDetails, { extraState: { openChangeReason: eventDetails.reason } });
-  };
-  cancelPendingOpen(event) {
-    this.state.floatingRootContext.dispatchOpenChange(false, createChangeEventDetails(triggerPress, event));
-  }
-};
-function createInitialState(initialState, triggerElements, floatingId, nested = false) {
-  const state = {
-    ...createInitialPopupStoreState(),
-    disabled: false,
-    instantType: void 0,
-    isInstantPhase: false,
-    trackCursorAxis: "none",
-    disableHoverablePopup: false,
-    openChangeReason: null,
-    closeOnClick: true,
-    closeDelay: 0,
-    adaptiveOrigin: void 0,
-    ...initialState
-  };
-  state.floatingRootContext = createPopupFloatingRootContext(triggerElements, floatingId, nested);
-  return state;
-}
-function createInitialContext(triggerElements) {
-  return {
-    popupRef: /* @__PURE__ */ React$1.createRef(),
-    onOpenChange: void 0,
-    onOpenChangeComplete: void 0,
-    triggerElements
-  };
-}
-var TooltipRoot = fastComponent(function TooltipRoot2(props) {
-  const { disabled: disabled$1 = false, defaultOpen = false, open: openProp, disableHoverablePopup = false, trackCursorAxis = "none", actionsRef, onOpenChange, onOpenChangeComplete, handle, triggerId: triggerIdProp, defaultTriggerId: defaultTriggerIdProp = null, children } = props;
-  const store = usePopupRootStore((floatingId, nested) => new TooltipStore({
-    open: defaultOpen,
-    openProp,
-    activeTriggerId: defaultTriggerIdProp,
-    triggerIdProp
-  }, floatingId, nested));
-  store.useControlledProp("openProp", openProp);
-  store.useControlledProp("triggerIdProp", triggerIdProp);
-  store.useContextCallback("onOpenChange", onOpenChange);
-  store.useContextCallback("onOpenChangeComplete", onOpenChangeComplete);
-  const openState = store.useState("open");
-  const open = !disabled$1 && openState;
-  const activeTriggerId = store.useState("activeTriggerId");
-  const mounted = store.useState("mounted");
-  const payload = store.useState("payload");
-  store.useSyncedValues({
-    trackCursorAxis,
-    disableHoverablePopup,
-    disabled: disabled$1
-  });
-  useImplicitActiveTrigger(store, { closeOnActiveTriggerUnmount: true });
-  const { forceUnmount, transitionStatus } = useOpenStateTransitions(open, store);
-  const isInstantPhase = store.useState("isInstantPhase");
-  const instantType = store.useState("instantType");
-  const lastOpenChangeReason = store.useState("lastOpenChangeReason");
-  const previousInstantTypeRef = React$1.useRef(null);
-  useIsoLayoutEffect(() => {
-    if (openState && disabled$1) store.setOpen(false, createChangeEventDetails(disabled));
-  }, [
-    openState,
-    disabled$1,
-    store
-  ]);
-  useIsoLayoutEffect(() => {
-    if (transitionStatus === "ending" && lastOpenChangeReason === "none" || transitionStatus !== "ending" && isInstantPhase) {
-      if (instantType !== "delay") previousInstantTypeRef.current = instantType;
-      store.set("instantType", "delay");
-    } else if (previousInstantTypeRef.current !== null) {
-      store.set("instantType", previousInstantTypeRef.current);
-      previousInstantTypeRef.current = null;
-    }
-  }, [
-    transitionStatus,
-    isInstantPhase,
-    lastOpenChangeReason,
-    instantType,
-    store
-  ]);
-  useIsoLayoutEffect(() => {
-    if (open) {
-      if (activeTriggerId == null) store.set("payload", void 0);
-    }
-  }, [
-    store,
-    activeTriggerId,
-    open
-  ]);
-  React$1.useImperativeHandle(actionsRef, () => ({
-    unmount: forceUnmount,
-    close: () => store.setOpen(false, createChangeEventDetails(imperativeAction))
-  }), [forceUnmount, store]);
-  const shouldRenderInteractions = open || mounted || !disabled$1 && trackCursorAxis !== "none";
-  return /* @__PURE__ */ jsxs(TooltipRootContext.Provider, {
-    value: store,
-    children: [
-      handle && /* @__PURE__ */ jsx(PopupHandleAttachment, {
-        handle,
-        store
-      }),
-      shouldRenderInteractions && /* @__PURE__ */ jsx(TooltipInteractions, {
-        store,
-        disabled: disabled$1,
-        trackCursorAxis
-      }),
-      typeof children === "function" ? children({ payload }) : children
-    ]
-  });
-});
-function TooltipInteractions({ store, disabled: disabled2, trackCursorAxis }) {
-  const floatingRootContext = store.useState("floatingRootContext");
-  const dismiss = useDismiss(floatingRootContext, {
-    enabled: !disabled2,
-    referencePress: () => store.select("closeOnClick")
-  });
-  const clientPoint = useClientPoint(floatingRootContext, {
-    enabled: !disabled2 && trackCursorAxis !== "none",
-    axis: trackCursorAxis === "none" ? void 0 : trackCursorAxis
-  });
-  const triggerProps = React$1.useMemo(() => mergeProps(clientPoint.reference, dismiss.reference), [clientPoint.reference, dismiss.reference]);
-  usePopupInteractionProps(store, {
-    activeTriggerProps: triggerProps,
-    inactiveTriggerProps: triggerProps,
-    popupProps: dismiss.floating ?? EMPTY_OBJECT
-  });
-  return null;
-}
-var TooltipProviderContext = /* @__PURE__ */ React$1.createContext(void 0);
-function useTooltipProviderContext() {
-  return React$1.useContext(TooltipProviderContext);
-}
-var TOOLTIP_TRIGGER_IDENTIFIER = "data-base-ui-tooltip-trigger";
-function getTargetElement(event) {
-  if ("composedPath" in event) {
-    const path = event.composedPath();
-    for (let i = 0; i < path.length; i += 1) {
-      const element = path[i];
-      if (isElement(element)) return element;
-    }
-  }
-  const target = event.target;
-  if (isElement(target)) return target;
-  return null;
-}
-function closestEnabledTooltipTrigger(element) {
-  let current = element;
-  while (current) {
-    const trigger = current.closest(`[${TOOLTIP_TRIGGER_IDENTIFIER}]`);
-    if (trigger) return trigger;
-    const root = current.getRootNode();
-    current = "host" in root && isElement(root.host) ? root.host : null;
-  }
-  return null;
-}
-var TooltipTrigger$1 = fastComponentRef(function TooltipTrigger(componentProps, forwardedRef) {
-  const { render, className, style, handle, payload, disabled: disabledProp, delay: delay2, closeOnClick = true, closeDelay, id: idProp, ...elementProps } = componentProps;
-  const rootContext = useTooltipRootContext(true);
-  const store = usePopupHandleStore(handle) ?? rootContext;
-  if (!store) throw new Error(formatErrorMessage(82));
-  const thisTriggerId = useBaseUiId(idProp);
-  const isTriggerActive = store.useState("isTriggerActive", thisTriggerId);
-  const isOpenedByThisTrigger = store.useState("isOpenedByTrigger", thisTriggerId);
-  const floatingRootContext = store.useState("floatingRootContext");
-  const triggerElementRef = React$1.useRef(null);
-  const delayWithDefault = delay2 ?? 600;
-  const closeDelayWithDefault = closeDelay ?? 0;
-  const { registerTrigger, isMountedByThisTrigger } = useTriggerDataForwarding(thisTriggerId, triggerElementRef, store, {
-    payload,
-    closeOnClick,
-    closeDelay: closeDelayWithDefault
-  });
-  const providerDelay = useTooltipProviderContext();
-  const { delayRef, isInstantPhase, hasProvider } = useDelayGroup(floatingRootContext, { open: isOpenedByThisTrigger });
-  const hoverInteraction = useHoverInteractionSharedState(floatingRootContext);
-  store.useSyncedValue("isInstantPhase", isInstantPhase);
-  const rootDisabled = store.useState("disabled");
-  const disabled2 = disabledProp ?? rootDisabled;
-  const disabledRef = useValueAsRef(disabled2);
-  const trackCursorAxis = store.useState("trackCursorAxis");
-  const disableHoverablePopup = store.useState("disableHoverablePopup");
-  const isNestedTriggerHoveredRef = React$1.useRef(false);
-  const nestedTriggerOpenTimeout = useTimeout();
-  const pointerTypeRef = React$1.useRef(void 0);
-  function getOpenDelay() {
-    if (!hasProvider) return delayWithDefault;
-    return getDelay(delayRef.current, "open") === 0 ? 0 : delay2 ?? providerDelay ?? 600;
-  }
-  function isEnabledNestedTriggerTarget(target) {
-    const triggerEl = triggerElementRef.current;
-    if (!triggerEl || !target) return false;
-    const nearestTrigger = closestEnabledTooltipTrigger(target);
-    return nearestTrigger !== null && nearestTrigger !== triggerEl && contains(triggerEl, nearestTrigger);
-  }
-  function detectNestedTriggerHover(target) {
-    const nestedTriggerHovered = isEnabledNestedTriggerTarget(target);
-    isNestedTriggerHoveredRef.current = nestedTriggerHovered;
-    if (nestedTriggerHovered) {
-      hoverInteraction.openChangeTimeout.clear();
-      hoverInteraction.restTimeout.clear();
-      hoverInteraction.restTimeoutPending = false;
-      nestedTriggerOpenTimeout.clear();
-    }
-    return nestedTriggerHovered;
-  }
-  const hoverProps = useHoverReferenceInteraction(floatingRootContext, {
-    enabled: !disabled2,
-    mouseOnly: true,
-    move: false,
-    handleClose: !disableHoverablePopup && trackCursorAxis !== "both" ? safePolygon() : null,
-    restMs: getOpenDelay,
-    delay() {
-      if (closeDelay == null && hasProvider) return { close: getDelay(delayRef.current, "close") };
-      return { close: closeDelayWithDefault };
-    },
-    triggerElementRef,
-    isActiveTrigger: isTriggerActive,
-    isClosing: () => store.select("transitionStatus") === "ending",
-    shouldOpen() {
-      return !isNestedTriggerHoveredRef.current;
-    }
-  });
-  const focusProps = useFocus(floatingRootContext, { enabled: !disabled2 }).reference;
-  const handleNestedTriggerHover = (event) => {
-    const wasNestedTriggerHovered = isNestedTriggerHoveredRef.current;
-    const target = getTargetElement(event);
-    const nestedTriggerHovered = detectNestedTriggerHover(target);
-    const triggerEl = triggerElementRef.current;
-    const targetInsideTrigger = triggerEl && target && contains(triggerEl, target);
-    if (nestedTriggerHovered && store.select("open") && store.select("lastOpenChangeReason") === "trigger-hover") {
-      store.setOpen(false, createChangeEventDetails(triggerHover, event));
-      return;
-    }
-    if (wasNestedTriggerHovered && !nestedTriggerHovered && targetInsideTrigger && !disabledRef.current && !store.select("open") && triggerEl && isMouseLikePointerType(pointerTypeRef.current)) {
-      const open = () => {
-        if (!isNestedTriggerHoveredRef.current && !disabledRef.current && !store.select("open")) store.setOpen(true, createChangeEventDetails(triggerHover, event, triggerEl));
-      };
-      const openDelay = getOpenDelay();
-      if (openDelay === 0) {
-        nestedTriggerOpenTimeout.clear();
-        open();
-      } else nestedTriggerOpenTimeout.start(openDelay, open);
-    }
-  };
-  const rootTriggerProps = store.useState("triggerProps", isMountedByThisTrigger);
-  return useRenderElement("button", componentProps, {
-    state: { open: isOpenedByThisTrigger },
-    ref: [
-      forwardedRef,
-      registerTrigger,
-      triggerElementRef
-    ],
-    props: [
-      hoverProps,
-      focusProps,
-      isMountedByThisTrigger || trackCursorAxis !== "none" ? rootTriggerProps : void 0,
-      {
-        onMouseOver(event) {
-          handleNestedTriggerHover(event.nativeEvent);
-        },
-        onFocus(event) {
-          if (isEnabledNestedTriggerTarget(getTargetElement(event.nativeEvent))) event.preventBaseUIHandler();
-        },
-        onMouseLeave() {
-          isNestedTriggerHoveredRef.current = false;
-          nestedTriggerOpenTimeout.clear();
-          pointerTypeRef.current = void 0;
-        },
-        onPointerEnter(event) {
-          pointerTypeRef.current = event.pointerType;
-        },
-        onPointerDown(event) {
-          pointerTypeRef.current = event.pointerType;
-          store.set("closeOnClick", closeOnClick);
-          if (closeOnClick && !store.select("open")) store.cancelPendingOpen(event.nativeEvent);
-        },
-        onClick(event) {
-          if (closeOnClick && !store.select("open")) store.cancelPendingOpen(event.nativeEvent);
-        },
-        id: thisTriggerId,
-        "data-trigger-disabled": disabled2 ? "" : void 0,
-        [TOOLTIP_TRIGGER_IDENTIFIER]: disabled2 ? void 0 : ""
-      },
-      elementProps
-    ],
-    stateAttributesMapping: triggerOpenStateMapping
-  });
-});
-var TooltipPortalContext = /* @__PURE__ */ React$1.createContext(void 0);
-function useTooltipPortalContext() {
-  const value = React$1.useContext(TooltipPortalContext);
-  if (value === void 0) throw new Error(formatErrorMessage(70));
-  return value;
-}
-var TooltipPortal = /* @__PURE__ */ React$1.forwardRef(function TooltipPortal2(props, forwardedRef) {
-  const { keepMounted = false, ...portalProps } = props;
-  if (!(useTooltipRootContext().useState("mounted") || keepMounted)) return null;
-  return /* @__PURE__ */ jsx(TooltipPortalContext.Provider, {
-    value: keepMounted,
-    children: /* @__PURE__ */ jsx(FloatingPortalLite, {
-      ref: forwardedRef,
-      ...portalProps
-    })
-  });
-});
-var TooltipPositionerContext = /* @__PURE__ */ React$1.createContext(void 0);
-function useTooltipPositionerContext() {
-  const context = React$1.useContext(TooltipPositionerContext);
-  if (context === void 0) throw new Error(formatErrorMessage(71));
-  return context;
-}
-var TooltipPositioner = /* @__PURE__ */ React$1.forwardRef(function TooltipPositioner2(componentProps, forwardedRef) {
-  const { render, className, anchor, positionMethod = "absolute", side = "top", align = "center", sideOffset = 0, alignOffset = 0, collisionBoundary = "clipping-ancestors", collisionPadding = 5, arrowPadding = 5, sticky = false, disableAnchorTracking = false, collisionAvoidance = POPUP_COLLISION_AVOIDANCE, style, ...elementProps } = componentProps;
-  const store = useTooltipRootContext();
-  const keepMounted = useTooltipPortalContext();
-  const open = store.useState("open");
-  const mounted = store.useState("mounted");
-  const trackCursorAxis = store.useState("trackCursorAxis");
-  const disableHoverablePopup = store.useState("disableHoverablePopup");
-  const floatingRootContext = store.useState("floatingRootContext");
-  const instantType = store.useState("instantType");
-  const transitionStatus = store.useState("transitionStatus");
-  const adaptiveOrigin = store.useState("adaptiveOrigin");
-  const positioning = useAnchorPositioning({
-    anchor,
-    positionMethod,
-    floatingRootContext,
-    mounted,
-    side,
-    sideOffset,
-    align,
-    alignOffset,
-    collisionBoundary,
-    collisionPadding,
-    sticky,
-    arrowPadding,
-    disableAnchorTracking,
-    keepMounted,
-    collisionAvoidance,
-    adaptiveOrigin
-  });
-  const state = React$1.useMemo(() => ({
-    open,
-    side: positioning.side,
-    align: positioning.align,
-    anchorHidden: positioning.anchorHidden,
-    instant: trackCursorAxis !== "none" ? "tracking-cursor" : instantType
-  }), [
-    open,
-    positioning.side,
-    positioning.align,
-    positioning.anchorHidden,
-    trackCursorAxis,
-    instantType
-  ]);
-  const element = usePositioner(componentProps, state, {
-    styles: positioning.positionerStyles,
-    transitionStatus,
-    props: elementProps,
-    refs: [forwardedRef, store.useStateSetter("positionerElement")],
-    hidden: !mounted,
-    inert: !open || trackCursorAxis === "both" || disableHoverablePopup
-  });
-  return /* @__PURE__ */ jsx(TooltipPositionerContext.Provider, {
-    value: positioning,
-    children: element
-  });
-});
-var TooltipPopup = /* @__PURE__ */ React$1.forwardRef(function TooltipPopup2(componentProps, forwardedRef) {
-  const { render, className, style, ...elementProps } = componentProps;
-  const store = useTooltipRootContext();
-  const { side, align } = useTooltipPositionerContext();
-  const open = store.useState("open");
-  const instantType = store.useState("instantType");
-  const transitionStatus = store.useState("transitionStatus");
-  const popupProps = store.useState("popupProps");
-  const floatingContext = store.useState("floatingRootContext");
-  const disabled2 = store.useState("disabled");
-  const closeDelay = store.useState("closeDelay");
-  useOpenChangeComplete({
-    open,
-    ref: store.context.popupRef,
-    onComplete() {
-      if (open) store.context.onOpenChangeComplete?.(true);
-    }
-  });
-  useHoverFloatingInteraction(floatingContext, {
-    enabled: !disabled2,
-    closeDelay
-  });
-  const setPopupElement = store.useStateSetter("popupElement");
-  return useRenderElement("div", componentProps, {
-    state: {
-      open,
-      side,
-      align,
-      instant: instantType,
-      transitionStatus
-    },
-    ref: [
-      forwardedRef,
-      store.context.popupRef,
-      setPopupElement
-    ],
-    props: [
-      FOCUSABLE_POPUP_PROPS,
-      popupProps,
-      getDisabledMountTransitionStyles(transitionStatus),
-      elementProps
-    ],
-    stateAttributesMapping: popupTransitionStateMapping
-  });
-});
-var TooltipArrow = /* @__PURE__ */ React$1.forwardRef(function TooltipArrow2(componentProps, forwardedRef) {
-  const { render, className, style, ...elementProps } = componentProps;
-  const store = useTooltipRootContext();
-  const { arrowRef, side, align, arrowUncentered, arrowStyles } = useTooltipPositionerContext();
-  const state = {
-    open: store.useState("open"),
-    side,
-    align,
-    uncentered: arrowUncentered,
-    instant: store.useState("instantType")
-  };
-  return useRenderElement("div", componentProps, {
-    state,
-    ref: [forwardedRef, arrowRef],
-    props: [{
-      style: arrowStyles,
-      "aria-hidden": true
-    }, elementProps],
-    stateAttributesMapping: popupStateMapping
-  });
-});
-function Tooltip({ ...props }) {
-  return /* @__PURE__ */ jsx(TooltipRoot, {
-    "data-slot": "tooltip",
-    ...props
-  });
-}
-function TooltipTrigger2({ ...props }) {
-  return /* @__PURE__ */ jsx(TooltipTrigger$1, {
-    "data-slot": "tooltip-trigger",
-    ...props
-  });
-}
-function TooltipContent({ className, side = "top", sideOffset = 4, align = "center", alignOffset = 0, children, ...props }) {
-  return /* @__PURE__ */ jsx(TooltipPortal, { children: /* @__PURE__ */ jsx(TooltipPositioner, {
-    align,
-    alignOffset,
-    side,
-    sideOffset,
-    className: "isolate z-50",
-    children: /* @__PURE__ */ jsxs(TooltipPopup, {
-      "data-slot": "tooltip-content",
-      className: cn("z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
-      ...props,
-      children: [children, /* @__PURE__ */ jsx(TooltipArrow, { className: "z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })]
-    })
-  }) });
-}
-var SIDEBAR_COOKIE_NAME = "sidebar_state";
-var SIDEBAR_COOKIE_MAX_AGE = 604800;
-var SIDEBAR_WIDTH = "16rem";
-var SIDEBAR_WIDTH_MOBILE = "18rem";
-var SIDEBAR_WIDTH_ICON = "3rem";
-var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React$1.createContext(null);
-function useSidebar() {
-  const context = React$1.useContext(SidebarContext);
-  if (!context) throw new Error("useSidebar must be used within a SidebarProvider.");
-  return context;
-}
-function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: setOpenProp, className, style, children, enableKeyboardShortcut = true, persistState = true, ...props }) {
-  const isMobile = useIsMobile();
-  const [openMobile, setOpenMobile] = React$1.useState(false);
-  const [internalOpen, setInternalOpen] = React$1.useState(defaultOpen);
-  const open = openProp ?? internalOpen;
-  const setOpen = React$1.useCallback((value) => {
-    const openState = typeof value === "function" ? value(open) : value;
-    if (setOpenProp) setOpenProp(openState);
-    else setInternalOpen(openState);
-    if (persistState) document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
-  }, [
-    setOpenProp,
-    open,
-    persistState
-  ]);
-  const toggleSidebar = React$1.useCallback(() => {
-    return isMobile ? setOpenMobile((prev) => !prev) : setOpen((prev) => !prev);
-  }, [
-    isMobile,
-    setOpen,
-    setOpenMobile
-  ]);
-  const onGlobalKeyDown = React$1.useEffectEvent((event) => {
-    if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
-      event.preventDefault();
-      toggleSidebar();
-    }
-  });
-  React$1.useEffect(() => {
-    if (!enableKeyboardShortcut) return;
-    const handleKeyDown = (event) => onGlobalKeyDown(event);
-    window.addEventListener("keydown", handleKeyDown);
-    return () => window.removeEventListener("keydown", handleKeyDown);
-  }, [enableKeyboardShortcut]);
-  const state = open ? "expanded" : "collapsed";
-  const contextValue = React$1.useMemo(() => ({
-    state,
-    open,
-    setOpen,
-    isMobile,
-    openMobile,
-    setOpenMobile,
-    toggleSidebar
-  }), [
-    state,
-    open,
-    setOpen,
-    isMobile,
-    openMobile,
-    setOpenMobile,
-    toggleSidebar
-  ]);
-  return /* @__PURE__ */ jsx(SidebarContext.Provider, {
-    value: contextValue,
-    children: /* @__PURE__ */ jsx("div", {
-      "data-slot": "sidebar-wrapper",
-      style: {
-        "--sidebar-width": SIDEBAR_WIDTH,
-        "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
-        ...style
-      },
-      className: cn("group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar", className),
-      ...props,
-      children
-    })
-  });
-}
-function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas", className, children, dir, ...props }) {
-  const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
-  if (collapsible === "none") return /* @__PURE__ */ jsx("div", {
-    "data-slot": "sidebar",
-    className: cn("flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground", className),
-    ...props,
-    children
-  });
-  if (isMobile) return /* @__PURE__ */ jsx(Sheet, {
-    open: openMobile,
-    onOpenChange: setOpenMobile,
-    ...props,
-    children: /* @__PURE__ */ jsxs(SheetContent, {
-      dir,
-      "data-sidebar": "sidebar",
-      "data-slot": "sidebar",
-      "data-mobile": "true",
-      className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
-      style: { "--sidebar-width": SIDEBAR_WIDTH_MOBILE },
-      side,
-      children: [/* @__PURE__ */ jsxs(SheetHeader, {
-        className: "sr-only",
-        children: [/* @__PURE__ */ jsx(SheetTitle, { children: "Sidebar" }), /* @__PURE__ */ jsx(SheetDescription, { children: "Displays the mobile sidebar." })]
-      }), /* @__PURE__ */ jsx("div", {
-        className: "flex h-full w-full flex-col",
-        children
-      })]
-    })
-  });
-  return /* @__PURE__ */ jsxs("div", {
-    className: "group peer hidden text-sidebar-foreground md:block",
-    "data-state": state,
-    "data-collapsible": state === "collapsed" ? collapsible : "",
-    "data-variant": variant,
-    "data-side": side,
-    "data-slot": "sidebar",
-    children: [/* @__PURE__ */ jsx("div", {
-      "data-slot": "sidebar-gap",
-      className: cn("relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear", "group-data-[collapsible=offcanvas]:w-0", "group-data-[side=right]:rotate-180", variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)")
-    }), /* @__PURE__ */ jsx("div", {
-      "data-slot": "sidebar-container",
-      "data-side": side,
-      className: cn("fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex", variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", className),
-      ...props,
-      children: /* @__PURE__ */ jsx("div", {
-        "data-sidebar": "sidebar",
-        "data-slot": "sidebar-inner",
-        className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border",
-        children
-      })
-    })]
-  });
-}
-function SidebarHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx("div", {
-    "data-slot": "sidebar-header",
-    "data-sidebar": "header",
-    className: cn("flex flex-col gap-2 p-2", className),
-    ...props
-  });
-}
-function SidebarContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx("div", {
-    "data-slot": "sidebar-content",
-    "data-sidebar": "content",
-    className: cn("no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden", className),
-    ...props
-  });
-}
-function SidebarGroup({ className, ...props }) {
-  return /* @__PURE__ */ jsx("div", {
-    "data-slot": "sidebar-group",
-    "data-sidebar": "group",
-    className: cn("relative flex w-full min-w-0 flex-col p-2", className),
-    ...props
-  });
-}
-function SidebarGroupLabel({ className, render, ...props }) {
-  return useRender({
-    defaultTagName: "div",
-    props: mergeProps({ className: cn("flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", className) }, props),
-    render,
-    state: {
-      slot: "sidebar-group-label",
-      sidebar: "group-label"
-    }
-  });
-}
-function SidebarGroupContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx("div", {
-    "data-slot": "sidebar-group-content",
-    "data-sidebar": "group-content",
-    className: cn("w-full text-sm", className),
-    ...props
-  });
-}
-function SidebarMenu({ className, ...props }) {
-  return /* @__PURE__ */ jsx("ul", {
-    "data-slot": "sidebar-menu",
-    "data-sidebar": "menu",
-    className: cn("flex w-full min-w-0 flex-col gap-0", className),
-    ...props
-  });
-}
-function SidebarMenuItem({ className, ...props }) {
-  return /* @__PURE__ */ jsx("li", {
-    "data-slot": "sidebar-menu-item",
-    "data-sidebar": "menu-item",
-    className: cn("group/menu-item relative", className),
-    ...props
-  });
-}
-var sidebarMenuButtonVariants = cva("peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate", {
-  variants: {
-    variant: {
-      default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
-      outline: "bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_var(--sidebar-accent)]"
-    },
-    size: {
-      default: "h-8 text-sm",
-      sm: "h-7 text-xs",
-      lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
-    }
-  },
-  defaultVariants: {
-    variant: "default",
-    size: "default"
-  }
-});
-function SidebarMenuButton({ render, isActive = false, variant = "default", size = "default", tooltip, className, ...props }) {
-  const { isMobile, state } = useSidebar();
-  const comp = useRender({
-    defaultTagName: "button",
-    props: mergeProps({ className: cn(sidebarMenuButtonVariants({
-      variant,
-      size
-    }), className) }, props),
-    render: !tooltip ? render : /* @__PURE__ */ jsx(TooltipTrigger2, { render }),
-    state: {
-      slot: "sidebar-menu-button",
-      sidebar: "menu-button",
-      size,
-      active: isActive
-    }
-  });
-  if (!tooltip) return comp;
-  if (typeof tooltip === "string") tooltip = { children: tooltip };
-  return /* @__PURE__ */ jsxs(Tooltip, { children: [comp, /* @__PURE__ */ jsx(TooltipContent, {
-    side: "right",
-    align: "center",
-    hidden: state !== "collapsed" || isMobile,
-    ...tooltip
-  })] });
-}
 function RowSurface({ className, interactive, padding, tone, ...props }) {
   return /* @__PURE__ */ jsx("div", {
-    className: cn(fleetPiRowSurface({
+    className: cn(rowSurface({
       interactive,
       padding,
       tone
@@ -2315,13 +1110,13 @@ function SettingsPane({ actions, children, description, title }) {
     })]
   });
 }
-function SettingsCommitActions({ dirty, disabled: disabled2, onRevert, onSave, saving }) {
+function SettingsCommitActions({ dirty, disabled, onRevert, onSave, saving }) {
   return /* @__PURE__ */ jsxs(Fragment$1, { children: [dirty ? /* @__PURE__ */ jsx(Button, {
     type: "button",
     variant: "ghost",
     size: "icon-sm",
     className: "text-muted-foreground transition-transform active:scale-[0.96]",
-    disabled: disabled2 || saving,
+    disabled: disabled || saving,
     onClick: onRevert,
     "aria-label": "Revert changes",
     children: /* @__PURE__ */ jsx(RotateCcw, {})
@@ -2330,7 +1125,7 @@ function SettingsCommitActions({ dirty, disabled: disabled2, onRevert, onSave, s
     variant: "outline",
     size: "sm",
     className: cn(COMPACT_ACTION_BUTTON_CLASS, "transition-transform active:scale-[0.96]", dirty && "border-primary/30 text-primary"),
-    disabled: !dirty || disabled2 || saving,
+    disabled: !dirty || disabled || saving,
     onClick: onSave,
     children: [saving ? /* @__PURE__ */ jsx(LoaderCircle, {
       className: "animate-spin",
@@ -2364,7 +1159,7 @@ function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
     onOAuthLogin,
     providerId
   ]);
-  const cancelLoginId = useCallback2(async (loginId) => {
+  const cancelLoginId = useCallback(async (loginId) => {
     if (!loginId || !onOAuthLoginRef.current) return;
     try {
       await onOAuthLoginRef.current({
@@ -2375,7 +1170,7 @@ function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
     } catch {
     }
   }, []);
-  const resetLocal = useCallback2(() => {
+  const resetLocal = useCallback(() => {
     loginIdRef.current = null;
     startingRef.current = false;
     setLogin(null);
@@ -2390,7 +1185,7 @@ function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
       cancelLoginId(loginId);
     };
   }, [cancelLoginId]);
-  const applyResult = useCallback2((result, generation) => {
+  const applyResult = useCallback((result, generation) => {
     if (generation !== generationRef.current) {
       if (result.status === "waiting" && result.loginId) cancelLoginId(result.loginId);
       return;
@@ -2416,7 +1211,7 @@ function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
     if (result.loginId) loginIdRef.current = result.loginId;
     setLogin(result);
   }, [cancelLoginId]);
-  const start = useCallback2(async () => {
+  const start = useCallback(async () => {
     if (!onOAuthLoginRef.current || startingRef.current) return;
     startingRef.current = true;
     const generation = generationRef.current;
@@ -2443,7 +1238,7 @@ function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
       if (generation === generationRef.current) setBusy(false);
     }
   }, [applyResult, cancelLoginId]);
-  const submitPrompt = useCallback2(async () => {
+  const submitPrompt = useCallback(async () => {
     const loginId = loginIdRef.current;
     if (!onOAuthLoginRef.current || !loginId) return;
     const generation = generationRef.current;
@@ -2463,7 +1258,7 @@ function useOAuthLoginFlow({ onConfigured, onOAuthLogin, providerId }) {
       if (generation === generationRef.current) setBusy(false);
     }
   }, [applyResult, promptAnswer]);
-  const cancel = useCallback2(async () => {
+  const cancel = useCallback(async () => {
     generationRef.current += 1;
     const loginId = loginIdRef.current;
     resetLocal();
@@ -3088,7 +1883,7 @@ function AddModelsDialog({ configuredProviderIds, discoverableProviderIds, disco
             children: groupedCandidates.map(([provider, models]) => /* @__PURE__ */ jsxs("div", {
               className: "flex flex-col gap-1",
               children: [/* @__PURE__ */ jsxs("div", {
-                className: "px-2 text-[0.6875rem] font-medium tracking-wide text-muted-foreground uppercase",
+                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: [
@@ -3161,7 +1956,7 @@ function AddModelsDialog({ configuredProviderIds, discoverableProviderIds, disco
 }
 function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelFilter, modelOptions, onAddModels, onDiscoverProvider, onModelFilterChange, onRemoveModel, onSetDefaultModel, onRevert, onSave, providers, saving, settingsLoading }) {
   const [addOpen, setAddOpen] = useState2(false);
-  const disabled2 = !draft || settingsLoading;
+  const disabled = !draft || settingsLoading;
   const normalizedFilter = modelFilter.trim().toLowerCase();
   const configuredProviderIds = useMemo2(() => {
     const ids = /* @__PURE__ */ new Set();
@@ -3242,7 +2037,7 @@ function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelF
     ] }),
     actions: /* @__PURE__ */ jsx(SettingsCommitActions, {
       dirty: modelDirty,
-      disabled: disabled2,
+      disabled,
       onRevert,
       onSave,
       saving
@@ -3260,13 +2055,13 @@ function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelF
             value: modelFilter,
             onChange: (event) => onModelFilterChange(event.target.value),
             placeholder: "Search listed models\u2026",
-            disabled: disabled2 || listedModels.length === 0
+            disabled: disabled || listedModels.length === 0
           })]
         }), /* @__PURE__ */ jsxs(Button, {
           type: "button",
           variant: "outline",
           size: "sm",
-          disabled: disabled2,
+          disabled,
           onClick: openAddDialog,
           children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
         })]
@@ -3283,7 +2078,7 @@ function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelF
             type: "button",
             variant: "outline",
             size: "sm",
-            disabled: disabled2,
+            disabled,
             onClick: openAddDialog,
             children: [/* @__PURE__ */ jsx(Plus, { "data-icon": "inline-start" }), "Add models"]
           }) : null]
@@ -3306,7 +2101,7 @@ function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelF
                 variant: "ghost",
                 size: "sm",
                 className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 active:scale-[0.96]"),
-                disabled: disabled2,
+                disabled,
                 "aria-label": `Set ${model.name} as default`,
                 onClick: () => onSetDefaultModel(model),
                 children: [/* @__PURE__ */ jsx(Star, { "data-icon": "inline-start" }), "Set default"]
@@ -3315,7 +2110,7 @@ function ModelDefaultsSection({ draft, discoveringProviderId, modelDirty, modelF
                 variant: "ghost",
                 size: "sm",
                 className: cn(HIT_AREA_EXPAND_DENSE_CLASS, "h-7 px-2 text-xs text-muted-foreground transition-[background-color,color,transform] duration-150 hover:text-destructive active:scale-[0.96]"),
-                disabled: disabled2,
+                disabled,
                 "aria-label": `Remove ${model.name}`,
                 onClick: () => onRemoveModel(model),
                 children: [/* @__PURE__ */ jsx(Trash2, { "data-icon": "inline-start" }), "Remove"]
@@ -3808,7 +2603,7 @@ function AddProviderPickerPanel({ addPickerQuery, credentialProvidersLength, fil
           }) : null, filteredPickerConfigured.length > 0 ? /* @__PURE__ */ jsxs("div", {
             className: "flex flex-col gap-1",
             children: [filteredPickerAvailable.length > 0 ? /* @__PURE__ */ jsx("p", {
-              className: "px-2 pt-1 text-[0.6875rem] font-medium tracking-wide text-muted-foreground uppercase",
+              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,
@@ -4371,7 +3166,7 @@ var DELIVERY_OPTIONS = [{
   label: "One at a time"
 }];
 function HarnessRuntimeSection({ draft, updateDraft }) {
-  const disabled2 = !draft;
+  const disabled = !draft;
   return /* @__PURE__ */ jsxs("div", {
     className: "flex flex-col gap-2",
     children: [
@@ -4381,7 +3176,7 @@ function HarnessRuntimeSection({ draft, updateDraft }) {
         trailing: /* @__PURE__ */ jsx(Switch, {
           "aria-label": "Compaction",
           checked: draft?.compaction.enabled ?? false,
-          disabled: disabled2,
+          disabled,
           onCheckedChange: (enabled) => updateDraft((current) => ({
             ...current,
             compaction: {
@@ -4397,7 +3192,7 @@ function HarnessRuntimeSection({ draft, updateDraft }) {
         trailing: /* @__PURE__ */ jsx(Switch, {
           "aria-label": "Auto-retry",
           checked: draft?.retry.enabled ?? false,
-          disabled: disabled2,
+          disabled,
           onCheckedChange: (enabled) => updateDraft((current) => ({
             ...current,
             retry: {
@@ -4412,7 +3207,7 @@ function HarnessRuntimeSection({ draft, updateDraft }) {
         trailing: /* @__PURE__ */ jsx(Select, {
           "aria-label": "Transport",
           className: "w-[160px]",
-          disabled: disabled2,
+          disabled,
           onValueChange: (value) => updateDraft((current) => ({
             ...current,
             transport: value
@@ -4427,7 +3222,7 @@ function HarnessRuntimeSection({ draft, updateDraft }) {
         trailing: /* @__PURE__ */ jsx(Select, {
           "aria-label": "Steering",
           className: "w-[160px]",
-          disabled: disabled2,
+          disabled,
           onValueChange: (value) => updateDraft((current) => ({
             ...current,
             steeringMode: value
@@ -4442,7 +3237,7 @@ function HarnessRuntimeSection({ draft, updateDraft }) {
         trailing: /* @__PURE__ */ jsx(Select, {
           "aria-label": "Follow-up",
           className: "w-[160px]",
-          disabled: disabled2,
+          disabled,
           onValueChange: (value) => updateDraft((current) => ({
             ...current,
             followUpMode: value
@@ -4455,14 +3250,14 @@ function HarnessRuntimeSection({ draft, updateDraft }) {
   });
 }
 function ResourcesSection({ draft, onEnableSkillCommandsChange, onExtensionsChange, onPackageRowsChange, onPromptsChange, onRevert, onSave, onSkillsChange, onThemesChange, packageError, packageRows, resourceDirty, resources, resourceSummary, saving, scope = "harness", settingsLoading, updateDraft }) {
-  const disabled2 = !draft || settingsLoading || !!packageError;
+  const 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: disabled2,
+      disabled,
       onRevert,
       onSave,
       saving
@@ -4801,7 +3596,7 @@ function useModelDefaultsForm({ draft, setDraft, updateDraft, settings, provider
   ]);
   const modelBaseline = lastCommittedModelSettings.current ?? (settings ? comparableModelSettings(settings.effective) : null);
   const modelDirty = !!draft && !!modelBaseline && !sameJson(comparableModelSettings(draft), modelBaseline);
-  const resetCommittedModelBaseline = useCallback2(() => {
+  const resetCommittedModelBaseline = useCallback(() => {
     lastCommittedModelSettings.current = null;
   }, []);
   const commitModelSettings = async (nextDraft, options) => {
@@ -5172,18 +3967,17 @@ function useSettingsForm() {
     resetCommittedModelBaseline
   };
 }
-function SidebarNavItem({ active, onClick, icon: Icon, label }) {
-  return /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsxs(SidebarMenuButton, {
-    isActive: active,
+function SettingsNavItem({ active, onClick, icon: Icon, label }) {
+  return /* @__PURE__ */ jsxs("button", {
+    type: "button",
     onClick,
-    children: [/* @__PURE__ */ jsx(Icon, {}), /* @__PURE__ */ jsx("span", { children: label })]
-  }) });
+    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(() => {
-    const preferences = readUiPreferences();
-    document.documentElement.dataset.density = preferences.density;
-    document.documentElement.classList.toggle("reduce-motion", preferences.motion === "reduced");
+    applyUiPreferencesToDocument(readUiPreferences());
   }, []);
   return /* @__PURE__ */ jsx(SettingsDialogSession, {
     initialTab,
@@ -5270,6 +4064,7 @@ function SettingsDialogPaneContent({ activeTab, form, preferences, updatePrefere
           label: "Density",
           description: "Adjust spacing across chat and panels.",
           children: /* @__PURE__ */ jsx(Select, {
+            "aria-label": "Density",
             value: preferences.density,
             onValueChange: (value) => updatePreference("density", value),
             options: [{
@@ -5285,6 +4080,7 @@ function SettingsDialogPaneContent({ activeTab, form, preferences, updatePrefere
           label: "Motion",
           description: "Respect the system setting or reduce UI motion.",
           children: /* @__PURE__ */ jsx(Select, {
+            "aria-label": "Motion",
             value: preferences.motion,
             onValueChange: (value) => updatePreference("motion", value),
             options: [{
@@ -5310,6 +4106,7 @@ function SettingsDialogPaneContent({ activeTab, form, preferences, updatePrefere
         label: "Streaming transcript",
         description: "Follow new output or preserve the reading position.",
         children: /* @__PURE__ */ jsx(Select, {
+          "aria-label": "Streaming transcript",
           value: preferences.transcript,
           onValueChange: (value) => updatePreference("transcript", value),
           options: [{
@@ -5418,9 +4215,7 @@ function SettingsDialogBody({ initialTab, onCloseAttemptRef, onOpenChange }) {
   const [activeTab, setActiveTab] = useState2(() => initialTab ?? "appearance");
   const [preferences, setPreferences] = useState2(readUiPreferences);
   useEffect2(() => {
-    writeStoredValue(UI_PREFERENCES_KEY, JSON.stringify(preferences));
-    document.documentElement.dataset.density = preferences.density;
-    document.documentElement.classList.toggle("reduce-motion", preferences.motion === "reduced");
+    writeUiPreferences(preferences);
   }, [preferences]);
   const updatePreference = (key, value) => {
     setPreferences((current) => ({
@@ -5481,25 +4276,32 @@ function SettingsDialogBody({ initialTab, onCloseAttemptRef, onOpenChange }) {
         className: "sr-only",
         children: "Customize your settings here."
       }),
-      /* @__PURE__ */ jsxs(SidebarProvider, {
-        className: "h-full min-h-0 min-w-0",
-        enableKeyboardShortcut: false,
-        persistState: false,
-        children: [/* @__PURE__ */ jsxs(Sidebar, {
-          collapsible: "none",
-          className: "hidden h-full shrink-0 flex-col border-r border-sidebar-border bg-sidebar sm:flex sm:w-52",
-          children: [/* @__PURE__ */ jsx(SidebarHeader, {
-            className: "px-4 pt-5 pb-2",
-            children: /* @__PURE__ */ jsx("span", {
-              className: "text-sm font-semibold",
-              children: "Settings"
-            })
-          }), /* @__PURE__ */ jsx(SidebarContent, { children: SETTINGS_SECTION_GROUPS.map((group) => /* @__PURE__ */ jsxs(SidebarGroup, { children: [/* @__PURE__ */ jsx(SidebarGroupLabel, { children: group.label }), /* @__PURE__ */ jsx(SidebarGroupContent, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: SETTINGS_SECTIONS.filter((section) => section.group === group.id).map((section) => /* @__PURE__ */ jsx(SidebarNavItem, {
-            active: activeTab === section.id,
-            onClick: () => setActiveTab(section.id),
-            icon: section.icon,
-            label: section.title
-          }, section.id)) }) })] }, group.id)) })]
+      /* @__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-4 pt-5 pb-2 text-label font-semibold",
+            children: "Settings"
+          }), /* @__PURE__ */ jsx("div", {
+            className: "min-h-0 flex-1 overflow-y-auto px-2 pb-4",
+            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: [