diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
index 55531450e0..fdcbfcff5e 100644
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@@ -101,14 +101,38 @@ jobs:
       - name: Setup pnpm, Node.js, and dependencies
         uses: ./.github/actions/setup
 
+      - name: Get Playwright version
+        id: playwright-version
+        run: echo "version=$(pnpm exec playwright-core --version | awk '{print $2}')" >> "$GITHUB_OUTPUT"
+
+      # Cache the browser to avoid relying on azure.archive.ubuntu.com, which
+      # can be flaky. Only the default branch is trusted to write the cache,
+      # so PR runs cannot poison it.
+      - name: Restore Chromium cache
+        id: playwright-chromium-cache
+        uses: actions/cache/restore@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
+        with:
+          path: ~/.cache/ms-playwright
+          key: playwright-chromium-${{ runner.os }}-${{ steps.playwright-version.outputs.version }}
+
       - name: Install Chromium
-        run: pnpm exec playwright-core install --with-deps chromium
+        run: pnpm exec playwright-core install chromium
+        timeout-minutes: 5
+
+      - name: Save Chromium cache
+        if: github.ref == 'refs/heads/main' && steps.playwright-chromium-cache.outputs.cache-hit != 'true'
+        uses: actions/cache/save@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
+        with:
+          path: ~/.cache/ms-playwright
+          key: ${{ steps.playwright-chromium-cache.outputs.cache-primary-key }}
 
       # Builds the Storybook (buildCommand in pixel.jsonc) and snapshots it.
       - name: Snapshot
         run: pnpm exec pixel-storybook
         env:
           PIXEL_KEY: ${{ secrets.PIXEL_KEY }}
+          # On pull_request, github.sha is a synthetic merge commit, not the PR head.
+          PIXEL_COMMIT: ${{ github.event.pull_request.head.sha || github.sha }}
           # Auto-approve on mainline to avoid blocking CI after squash merges.
           PIXEL_AUTO_REVIEW: ${{ github.ref == 'refs/heads/main' }}
 
diff --git a/.storybook/main.ts b/.storybook/main.ts
index 5b262100d4..54f71a684c 100644
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@@ -6,7 +6,11 @@ import type { StorybookConfig } from "@storybook/react-vite";
 
 const config: StorybookConfig = {
 	stories: ["../packages/*/src/**/*.stories.@(ts|tsx)"],
-	addons: ["@storybook/addon-a11y", "@storybook/addon-docs"],
+	addons: [
+		"@storybook/addon-a11y",
+		"@storybook/addon-docs",
+		"storybook-addon-pseudo-states",
+	],
 	framework: {
 		name: "@storybook/react-vite",
 		options: {},
diff --git a/.storybook/preview.ts b/.storybook/preview.ts
index ad5833c39f..ef464fb77a 100644
--- a/.storybook/preview.ts
+++ b/.storybook/preview.ts
@@ -1,5 +1,6 @@
 /// <reference types="vite/client" />
 
+import { isPixel } from "@coder/pixel-storybook/storyapi";
 import codiconCssUrl from "@vscode/codicons/dist/codicon.css?url";
 import { createElement } from "react";
 
@@ -29,6 +30,11 @@ if (typeof window !== "undefined") {
 	});
 }
 
+// Lets us skip motion animation during Pixel captures.
+if (typeof document !== "undefined" && isPixel()) {
+	document.documentElement.setAttribute("data-pixel", "true");
+}
+
 // Inject codicon stylesheet immediately (before any components render)
 // Must be a <link> element with id "vscode-codicon-stylesheet" for vscode-elements
 if (
diff --git a/AGENTS.md b/AGENTS.md
index e40c60cedd..ac0a27720c 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -94,6 +94,15 @@ Non-negotiables:
 - Extension panels must call **both** `buildCommandHandlers` and
   `buildRequestHandlers` (empty `{}` is fine). This gives a compile error
   when anyone adds an action to the API without a matching handler.
+- Every webview and Storybook build runs the React Compiler, so components
+  and hooks must follow the rules of React: no reading or writing a ref
+  during render, no mutating props, state, or anything already rendered,
+  and hooks called unconditionally. A component that breaks them is skipped
+  silently and loses its memoization. Parameter defaults that read another
+  prop (`focused = adapter?.focusedId === row.node.id`) are the usual
+  culprit; put those defaults in the body. `useMemo` and `useCallback` are
+  rarely needed, and when kept they must list every dependency, or
+  `react-hooks/preserve-manual-memoization` fails the lint.
 
 ## Code Style
 
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 135c3fe27d..6dda93f906 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,36 @@
      from published versions since it shows up in the VS Code extension changelog
      tab and is confusing to users. Add it back between releases if needed. -->
 
+## [v1.16.3](https://github.com/coder/vscode-coder/releases/tag/v1.16.3) 2026-09-14
+
+### Changed
+
+- Store your session token in the OS keyring by default on macOS and Windows,
+  shared with the `coder` CLI: signing in here also signs in the CLI. Requires
+  Coder CLI 2.29.0 or later; Linux and older CLIs keep using a file. To opt
+  out, set `coder.useKeyring` to `false`.
+- Ask whether to sign the `coder` CLI out too when you sign out, or remove
+  credentials with **Coder: Manage Credentials**, and the CLI shares your
+  session.
+- Pass `coder.useKeyring` to the CLI as `--use-keyring`, so it overrides the
+  `CODER_USE_KEYRING` environment variable.
+- Treat the `CODER_CONFIG_DIR` environment variable like `--global-config` in
+  `coder.globalFlags`.
+- Require Coder CLI 2.32.0 or later, up from 2.31.0, to sign in with the CLI's
+  session or share its config directory.
+- Ask before signing in with the `coder` CLI's session when it belongs to a
+  different user.
+- Show **Open Settings** when the CLI cannot store the token at login, and
+  **Show Output** when signing out cannot remove every credential.
+- Group the workspaces view's **...** menu: **Switch Deployment** and
+  **Logout** first, then **Network Check**.
+
+### Fixed
+
+- Pass `--allow-redirects` to Coder CLI 2.38.0 or later, which otherwise
+  refuses a redirected deployment URL and fails `coder login`, `coder logout`,
+  and `coder ssh`.
+
 ## [v1.16.2](https://github.com/coder/vscode-coder/releases/tag/v1.16.2) 2026-08-25
 
 ### Fixed
diff --git a/README.md b/README.md
index 7588f51956..2010fcfa58 100644
--- a/README.md
+++ b/README.md
@@ -18,8 +18,6 @@ The Coder Remote extension connects your editor to
   (formerly Windsurf), and other VS Code forks.
 - **Workspace sidebar** - browse, search, and create workspaces. View agent
   metadata and app statuses at a glance.
-- **Coder Tasks** - create, monitor, and manage AI agent tasks directly from
-  the sidebar with real-time log streaming.
 - **Multi-deployment support** - connect to multiple Coder deployments and
   switch between them without losing credentials.
 - **Dev container support** - open dev containers running inside workspaces.
diff --git a/package.json b/package.json
index 203b9b23d9..982ec1a0f9 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "coder-remote",
 	"displayName": "Coder",
-	"version": "1.16.2",
+	"version": "1.16.3",
 	"description": "Open any workspace with a single click.",
 	"categories": [
 		"Other"
@@ -195,7 +195,7 @@
 					"ignoreSync": true
 				},
 				"coder.globalFlags": {
-					"markdownDescription": "Global flags to pass to every Coder CLI invocation. Enter each flag as a separate array item, in order. Do **not** include the `coder` command itself. See the [CLI reference](https://coder.com/docs/reference/cli) for available global flags.\n\nSupports `${env:VAR}`, `${userHome}`, and a leading `~`. For `--flag=value` items the expansion applies to the value half, so `--cfg=~/coder` works.\n\nSet `--global-config` here to point the CLI at a shared config directory (e.g. `--global-config=~/.config/coderv2` to share login/auth with the Coder CLI); requires a deployment on 2.31.0+ and is ignored when `#coder.useKeyring#` is active. The `--use-keyring` flag is ignored; use `#coder.useKeyring#` instead.\n\nFor `--header-command`, precedence is: `#coder.headerCommand#` setting, then `CODER_HEADER_COMMAND` environment variable, then the value specified here.",
+					"markdownDescription": "Global flags to pass to every Coder CLI invocation. Enter each flag as a separate array item, in order. Do **not** include the `coder` command itself. See the [CLI reference](https://coder.com/docs/reference/cli) for available global flags.\n\nSupports `${env:VAR}`, `${userHome}`, and a leading `~`. For `--flag=value` items the expansion applies to the value half, so `--cfg=~/coder` works.\n\nTo share a config directory with the `coder` CLI, add `--global-config` here (for example `--global-config=~/.config/coderv2`) or set `CODER_CONFIG_DIR`. Requires Coder CLI 2.32.0 or later. A `--use-keyring` item is ignored; use `#coder.useKeyring#` instead.\n\nFor `--header-command`, precedence is: `#coder.headerCommand#` setting, then `CODER_HEADER_COMMAND` environment variable, then the value specified here.",
 					"type": "array",
 					"items": {
 						"type": "string"
@@ -204,9 +204,9 @@
 					"ignoreSync": true
 				},
 				"coder.useKeyring": {
-					"markdownDescription": "Store session tokens in the OS keyring (macOS Keychain, Windows Credential Manager) instead of plaintext files. Requires CLI >= 2.29.0 (>= 2.31.0 to sync login from CLI to VS Code). This will attempt to sync between the CLI and VS Code since they share the same keyring entry. It will log you out of the CLI if you log out of the IDE, and vice versa. Has no effect on Linux.",
+					"markdownDescription": "Store session tokens in the OS keyring (macOS Keychain, Windows Credential Manager) instead of a file. Requires Coder CLI 2.29.0 or later; 2.32.0 or later to sign in with the CLI's existing session. Has no effect on Linux.\n\nThe keyring entry is shared with the `coder` CLI: signing in here also signs in the CLI, and signing out asks whether to sign out the CLI too.",
 					"type": "boolean",
-					"default": false,
+					"default": true,
 					"scope": "application"
 				},
 				"coder.networkThreshold.latencyMs": {
@@ -678,14 +678,17 @@
 			"view/title": [
 				{
 					"command": "coder.logout",
+					"group": "deployment@2",
 					"when": "coder.authenticated && view == myWorkspaces"
 				},
 				{
 					"command": "coder.netcheck",
+					"group": "diagnostics@1",
 					"when": "coder.authenticated && view == myWorkspaces"
 				},
 				{
 					"command": "coder.switchDeployment",
+					"group": "deployment@1",
 					"when": "coder.authenticated && view == myWorkspaces"
 				},
 				{
@@ -781,28 +784,28 @@
 	"dependencies": {
 		"@abraham/reflection": "^0.13.0",
 		"@opentelemetry/api": "^1.9.1",
-		"@opentelemetry/api-logs": "^0.221.0",
+		"@opentelemetry/api-logs": "^0.222.0",
 		"@peculiar/x509": "^2.0.0",
 		"@repo/shared": "workspace:*",
-		"axios": "^1.19.0",
+		"axios": "^1.20.0",
 		"date-fns": "catalog:",
 		"eventsource": "^5.1.1",
 		"fflate": "^0.8.3",
 		"find-process": "^2.1.1",
 		"jsonc-parser": "^3.3.1",
 		"openpgp": "^6.3.1",
-		"pretty-bytes": "^7.1.1",
+		"pretty-bytes": "^7.1.3",
 		"proper-lockfile": "^4.1.2",
 		"proxy-agent": "^8.0.2",
 		"semver": "^7.8.5",
 		"strip-ansi": "^7.2.0",
 		"ua-parser-js": "^1.0.41",
 		"ws": "^8.21.3",
-		"zod": "^4.4.3"
+		"zod": "^4.5.4"
 	},
 	"devDependencies": {
 		"@coder/pixel-storybook": "^0.3.0",
-		"@eslint-react/eslint-plugin": "^5.18.6",
+		"@eslint-react/eslint-plugin": "^5.18.7",
 		"@eslint/js": "^10.0.1",
 		"@eslint/markdown": "^8.0.3",
 		"@repo/mocks": "workspace:*",
@@ -812,7 +815,8 @@
 		"@storybook/react-vite": "catalog:",
 		"@tanstack/react-query": "catalog:",
 		"@testing-library/jest-dom": "^7.0.1",
-		"@testing-library/react": "^16.3.2",
+		"@testing-library/react": "^16.3.3",
+		"@testing-library/user-event": "catalog:",
 		"@tsconfig/node22": "^22.0.6",
 		"@types/mocha": "^10.0.10",
 		"@types/node": "^22.20.1",
@@ -824,8 +828,8 @@
 		"@types/vscode": "1.105.0",
 		"@types/vscode-webview": "catalog:",
 		"@types/ws": "^8.18.1",
-		"@typescript-eslint/eslint-plugin": "^8.67.0",
-		"@typescript-eslint/parser": "^8.67.0",
+		"@typescript-eslint/eslint-plugin": "^8.69.0",
+		"@typescript-eslint/parser": "^8.69.0",
 		"@vitejs/plugin-react": "catalog:",
 		"@vitest/coverage-v8": "^4.1.11",
 		"@vscode/codicons": "catalog:",
@@ -840,24 +844,25 @@
 		"dayjs": "^1.11.23",
 		"electron": "42.5.1",
 		"esbuild": "^0.28.2",
-		"eslint": "^10.9.0",
+		"eslint": "^10.9.1",
 		"eslint-config-prettier": "^10.1.8",
 		"eslint-import-resolver-typescript": "^4.4.5",
 		"eslint-plugin-import-x": "^4.17.1",
-		"eslint-plugin-package-json": "^1.7.1",
+		"eslint-plugin-package-json": "^1.8.0",
 		"eslint-plugin-react-hooks": "^7.1.1",
-		"eslint-plugin-storybook": "^10.5.10",
-		"globals": "^17.11.0",
+		"eslint-plugin-storybook": "^10.6.0",
+		"globals": "^17.12.0",
 		"jsdom": "^30.0.1",
 		"jsonc-eslint-parser": "^3.3.0",
-		"memfs": "^4.68.1",
+		"memfs": "^4.69.1",
 		"playwright-core": "^1.62.1",
 		"prettier": "^3.9.6",
 		"react": "catalog:",
 		"react-dom": "catalog:",
 		"storybook": "catalog:",
+		"storybook-addon-pseudo-states": "catalog:",
 		"typescript": "catalog:",
-		"typescript-eslint": "^8.67.0",
+		"typescript-eslint": "^8.69.0",
 		"utf-8-validate": "^6.0.6",
 		"vite": "catalog:",
 		"vitest": "^4.1.11"
@@ -865,7 +870,7 @@
 	"extensionPack": [
 		"ms-vscode-remote.remote-ssh"
 	],
-	"packageManager": "pnpm@11.23.0+sha512.f00082e5b283a199b74e079da28d155c008fe232f44c8a06ea7ddfa014ecf719fc362f790ecc67b28106ddac2afb24c49a9a079159da560b2ce7d1e98efd11af",
+	"packageManager": "pnpm@12.3.4+sha512.961aa41fb077da3a04a441d9f8e15ebc0c96da8ef710b2eb67bf9ee7cb0610eabd48f1fd85f51cffe73846785fa0f87c56a3a872a1d893f8446741b5cce45457",
 	"engines": {
 		"vscode": "^1.105.0",
 		"node": ">= 22"
diff --git a/packages/mocks/src/workspaces.ts b/packages/mocks/src/workspaces.ts
index 13378b1968..77b3458f1b 100644
--- a/packages/mocks/src/workspaces.ts
+++ b/packages/mocks/src/workspaces.ts
@@ -2,9 +2,11 @@
  * Test factories for Coder SDK workspace types.
  */
 
+import type { AgentMetadataState } from "@repo/shared";
 import type {
 	Workspace,
 	WorkspaceAgent,
+	WorkspaceAgentMetadata,
 	WorkspaceBuild,
 	WorkspaceResource,
 } from "coder/site/src/api/typesGenerated";
@@ -51,13 +53,21 @@ const defaultBuild: WorkspaceBuild = {
 	template_version_preset_id: null,
 };
 
-/** Create a Workspace with sensible defaults for a running task workspace. */
+/**
+ * Create a Workspace with sensible defaults for a running task workspace.
+ * `agents` puts them on a single resource, the common shape in tests.
+ */
 export function workspace(
 	overrides: Omit<Partial<Workspace>, "latest_build"> & {
 		latest_build?: Partial<WorkspaceBuild>;
+		agents?: WorkspaceAgent[];
 	} = {},
 ): Workspace {
-	const { latest_build: buildOverrides, ...rest } = overrides;
+	const { latest_build: buildOverrides, agents, ...rest } = overrides;
+	const build = { ...defaultBuild, ...buildOverrides };
+	if (agents) {
+		build.resources = [resource({ agents })];
+	}
 	return {
 		id: "workspace-1",
 		created_at: "2024-01-01T00:00:00Z",
@@ -75,7 +85,7 @@ export function workspace(
 		template_active_version_id: "version-1",
 		template_require_active_version: false,
 		template_use_classic_parameter_flow: false,
-		latest_build: { ...defaultBuild, ...buildOverrides },
+		latest_build: build,
 		latest_app_status: null,
 		outdated: false,
 		name: "test-workspace",
@@ -126,6 +136,41 @@ export function agent(overrides: Partial<WorkspaceAgent> = {}): WorkspaceAgent {
 	};
 }
 
+/** Create a WorkspaceAgentMetadata report with sensible defaults. */
+export function agentMetadata(
+	overrides: {
+		result?: Partial<WorkspaceAgentMetadata["result"]>;
+		description?: Partial<WorkspaceAgentMetadata["description"]>;
+	} = {},
+): WorkspaceAgentMetadata {
+	return {
+		result: {
+			collected_at: "2024-01-01T00:00:00Z",
+			age: 0,
+			value: "42",
+			error: "",
+			...overrides.result,
+		},
+		description: {
+			display_name: "CPU",
+			key: "cpu",
+			script: "cpu.sh",
+			interval: 5,
+			timeout: 1,
+			...overrides.description,
+		},
+	};
+}
+
+/** An agent whose socket is open, but which has not reported yet. */
+export const PENDING_METADATA: AgentMetadataState = { kind: "pending" };
+
+/** An agent that reported `agentMetadata()`. */
+export const REPORTED_METADATA: AgentMetadataState = {
+	kind: "reported",
+	metadata: [agentMetadata()],
+};
+
 /** Create a WorkspaceResource with sensible defaults. */
 export function resource(
 	overrides: Partial<WorkspaceResource> = {},
diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index 4f9b15143b..684e49e72e 100644
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -30,5 +30,6 @@ export type {
 	NetcheckSeverity,
 } from "./netcheck/types";
 
-// Workspaces API
+// Workspaces types and API
+export * from "./workspaces/types";
 export { WorkspacesApi } from "./workspaces/api";
diff --git a/packages/shared/src/workspaces/api.ts b/packages/shared/src/workspaces/api.ts
index 508b2e5b9e..2f0b6a20f5 100644
--- a/packages/shared/src/workspaces/api.ts
+++ b/packages/shared/src/workspaces/api.ts
@@ -1 +1,31 @@
-export const WorkspacesApi = {} as const;
+/**
+ * Workspaces API - Type-safe message definitions for the Workspaces webview.
+ *
+ * The extension owns the data and pushes it; the webview renders what it is
+ * given and sends back the actions the user takes.
+ */
+
+import { defineCommand, defineNotification } from "../ipc/protocol";
+
+import type {
+	OpenWorkspaceParams,
+	SetFilterParams,
+	ViewInDashboardParams,
+	WatchAgentsParams,
+	WorkspacesState,
+} from "./types";
+
+export const WorkspacesApi = {
+	// Notifications
+	/** The whole state, whenever any of it changes */
+	stateChanged: defineNotification<WorkspacesState>("stateChanged"),
+	// Commands
+	/** Webview signals its subscription is live and asks for the state */
+	ready: defineCommand<void>("ready"),
+	openWorkspace: defineCommand<OpenWorkspaceParams>("openWorkspace"),
+	viewInDashboard: defineCommand<ViewInDashboardParams>("viewInDashboard"),
+	refresh: defineCommand<void>("refresh"),
+	setFilter: defineCommand<SetFilterParams>("setFilter"),
+	/** Watch metadata for these agents only, so idle rows cost nothing */
+	watchAgents: defineCommand<WatchAgentsParams>("watchAgents"),
+} as const;
diff --git a/packages/shared/src/workspaces/types.ts b/packages/shared/src/workspaces/types.ts
new file mode 100644
index 0000000000..41eb4539d7
--- /dev/null
+++ b/packages/shared/src/workspaces/types.ts
@@ -0,0 +1,70 @@
+import type {
+	Workspace,
+	WorkspaceAgent,
+	WorkspaceAgentMetadata,
+} from "coder/site/src/api/typesGenerated";
+
+// Re-export SDK types for convenience
+export type { Workspace, WorkspaceAgent, WorkspaceAgentMetadata };
+
+export type WorkspaceFilter = "mine" | "shared" | "all";
+
+/** A workspace page in the dashboard, opened in the browser. */
+export type DashboardPage = "workspace" | "settings";
+
+/** What the panel may offer for the current session. */
+export interface WorkspacesCapabilities {
+	readonly authenticated: boolean;
+	/** Filters the user may select, in display order. */
+	readonly filters: readonly WorkspaceFilter[];
+}
+
+/**
+ * What the list is doing. `loading` is set only for a list the user waits on:
+ * the first one for a filter, or a refresh. Polls never set it.
+ */
+export type WorkspaceListStatus =
+	| { readonly kind: "loading" }
+	| { readonly kind: "ready" }
+	| { readonly kind: "failed"; readonly error: string };
+
+/** What one agent reports. A failure replaces its metadata in the UI. */
+export type AgentMetadataState =
+	| { readonly kind: "pending" }
+	| {
+			readonly kind: "reported";
+			readonly metadata: readonly WorkspaceAgentMetadata[];
+	  }
+	| { readonly kind: "failed"; readonly error: string };
+
+/** Keyed by agent id. */
+export type AgentMetadataMap = Readonly<Record<string, AgentMetadataState>>;
+
+/** Everything the panel renders. Pushed whole whenever any of it changes. */
+export interface WorkspacesState {
+	readonly capabilities: WorkspacesCapabilities;
+	readonly filter: WorkspaceFilter;
+	readonly workspaces: readonly Workspace[];
+	readonly status: WorkspaceListStatus;
+	readonly metadata: AgentMetadataMap;
+}
+
+export interface OpenWorkspaceParams {
+	readonly workspaceId: string;
+	/** Which agent to connect to. Picked interactively when omitted. */
+	readonly agentId?: string;
+}
+
+export interface ViewInDashboardParams {
+	readonly workspaceId: string;
+	readonly page: DashboardPage;
+}
+
+export interface SetFilterParams {
+	readonly filter: WorkspaceFilter;
+}
+
+export interface WatchAgentsParams {
+	/** The agents whose metadata the webview is showing. */
+	readonly agentIds: readonly string[];
+}
diff --git a/packages/ui/README.md b/packages/ui/README.md
index ec79369344..74ffecbc26 100644
--- a/packages/ui/README.md
+++ b/packages/ui/README.md
@@ -7,6 +7,11 @@ Its stable separation boundary is the public root exports, no monorepo runtime
 imports, and component CSS using only semantic `--ui-*` tokens. A future package
 build can emit those same entry points without API changes.
 
+Consumers compile these components with the React Compiler, so they follow the
+rules of React and lean on it for memoization. A component that breaks the
+rules is skipped silently rather than reported, which for a list or a tree
+costs a re-render per row, so check with the compiler and not only the linter.
+
 ## CSS
 
 Import the semantic token mapping and codicon assets once in each real webview
@@ -38,12 +43,126 @@ Every component forwards `className` and `style` to its root element, and
 default rules use single-class specificity, so a consumer class imported
 after the library overrides any default (width, height, spacing).
 
-Where VS Code's stable rendering and its Modern UI preview
-(`workbench.experimental.modernUI`) diverge, components follow Modern UI,
-and new components should too. Webviews get no signal for the setting, so
-the default cannot follow the host. Until the design settles,
-`data-ui-style="stable"` on the document root restores the stable-parity
-menu motion; Storybook's "UI style" toolbar switch toggles it live.
+VS Code currently uses its stable UI by default; Modern UI remains behind the
+experimental `workbench.experimental.modernUI` setting. `@repo/ui`
+intentionally uses Modern UI as its package default because webviews receive no
+host signal for that setting. The divergence is isolated: set
+`data-ui-style="stable"` on the document root to restore stable row geometry,
+focus behavior, and menu motion. Storybook's "UI style" toolbar switch toggles
+that override live.
+
+## Tree
+
+`Tree` is controlled: `nodes` describe the hierarchy, `expandedIds` controls
+branches, and the single- or multi-selection props control selection. Each
+visible node renders as a flat `treeitem`, while normal keyboard navigation
+keeps DOM focus on the `tree` container and identifies the active row with
+`aria-activedescendant`. Focus and selection are independent.
+
+```tsx
+const [selectedItemId, setSelectedItemId] = useState("src");
+const [expandedIds, setExpandedIds] = useState<readonly string[]>(["src"]);
+
+<Tree
+	aria-label="Explorer"
+	variant="explorer"
+	nodes={[
+		{
+			id: "src",
+			label: "src",
+			children: [{ id: "tree", label: "Tree.tsx", icon: "symbol-class" }],
+		},
+		{ id: "readme", label: "README.md", icon: "markdown" },
+	]}
+	expandedIds={expandedIds}
+	onExpandedIdsChange={setExpandedIds}
+	selectedItemId={selectedItemId}
+	onSelectedItemChange={setSelectedItemId}
+/>;
+```
+
+Ids must be unique across the whole tree, and a duplicate throws. A string
+`label` is also the accessible name; a rich label must provide `textValue`. `children` marks a branch, including an empty array for a branch
+whose children are still loading. `icon`, `action`, and `className` customize
+the row. Actions stay live on plain hover, as in the native list, and are
+isolated from row selection and expansion.
+
+Arrow Up/Down, Home, End, PageUp/PageDown, and buffered prefix/fuzzy typing
+move the active row through visible rows. Arrow Right
+expands a branch or enters it; Arrow Left collapses it or moves to its parent.
+
+`expandMode="singleClick"` is the default: clicking a branch selects
+and toggles it, and Enter does the same. With `expandMode="doubleClick"`, a
+single click or Enter only selects and a double click toggles expansion. Space
+toggles a branch without selecting it, or selects a leaf. A normal-row twistie
+toggles without changing selection. Alt-click recursively toggles descendant
+branches unless Alt is configured as the multi-selection modifier.
+
+Escape clears selection. It also clears the active focus mark when the tree has
+at most one selected row; after a larger multi-selection, a second Escape
+clears the remaining focus mark. Once neither selection nor a focus mark
+remains, Escape is left to the host. The root `onKeyDown` runs first, so a host
+can intercept shortcuts with `preventDefault()`.
+
+`multiSelect` uses `selectedItemIds` and `onSelectedItemsChange` and sets
+`aria-multiselectable`. `multiSelectModifier` chooses the toggle modifier:
+`"ctrlCmd"` (the default) uses Ctrl/Cmd and `"alt"` uses Alt. Shift-click and
+Shift+Arrow extend from the selection anchor; modifier clicks take precedence
+over expansion. Ctrl/Cmd+A selects the visible rows in the active sibling
+scope.
+
+`stickyScroll` pins ancestors against the nearest scrolling ancestor. `true`
+uses a maximum of seven pinned rows; a number supplies the maximum, and the
+widget is also capped at 40% of the viewport. The pinned region is a separate
+tab stop: Arrow Up/Down move among pinned ancestors, Arrow Down/Right from the
+deepest row enters its first visible child, Enter reveals, focuses, and selects
+the real row, Arrow Left reveals and focuses it and collapses an expanded
+branch, and Space only reveals and focuses it. A plain pointer click reveals,
+focuses, and selects; a pinned twistie additionally toggles the branch.
+Selection-modifier clicks update selection without revealing the real row.
+
+Webviews do not receive `workbench.tree.*` settings automatically. Consumers
+that mirror native sticky-scroll preferences must read
+`workbench.tree.enableStickyScroll` and
+`workbench.tree.stickyScrollMaxItemCount` in the extension host and send the
+values to the webview.
+
+```mermaid
+flowchart LR
+  accTitle: Tree architecture
+  accDescr: Data and input flow through the pure Tree modules into the React and DOM adapter.
+
+  Props[Nodes and controlled props] --> Model[treeModel.ts]
+  Events[Pointer and keyboard events] --> Policy[treePolicy.ts]
+  Policy --> Commands[Tree commands]
+  Model --> Transition[treeTransition.ts]
+  Commands --> Transition
+  Transition --> Adapter[useTreeAdapter.ts]
+  Adapter --> Rows[Tree.tsx and TreeRow.tsx]
+  Adapter --> Sticky[StickyScroll.tsx]
+  Rows --> Hover[TreeHover.tsx]
+```
+
+The model, policy, and transitions stay pure. The adapter owns React and DOM
+integration. The flat visible model supports future windowing, but the Tree is
+not currently virtualized.
+
+Rows are 22px tall and keep the VS Code twistie gutter. For Explorer-style file
+trees whose branches have no icons, `variant="explorer"` aligns leaf icons with
+branch twisties; do not combine it with branch icons. Indent guides appear on
+hover, selected ancestor paths stay active, and the focused path is active only
+while the tree has focus. The package default uses inset Modern UI rows;
+`data-ui-style="stable"` restores edge-to-edge square rows and stable focus
+styling.
+
+Labels hover with the node's text value, so truncated rows stay readable.
+Set `tooltip` for richer content or `null` to opt out. One bubble serves the
+whole tree, as in the native list: an invisible anchor moves to whatever the
+pointer reaches, taking its x from the cursor and its y from the target's box,
+the way a native hover placed at the mouse does. Each new target waits out the
+show delay, except within a row's action bar, where crossing between buttons is
+instant, the exception native grants a dense cluster of targets. Ctrl+K Ctrl+I opens the focused
+row's hover with no delay at all, and moving the focus closes it.
 
 ## Overlays
 
@@ -62,15 +181,55 @@ tooltips.
 `TooltipProvider` ancestor. Mount one provider per app so that a pointer
 moving between nearby triggers skips the show delay, like native hovers.
 The delay defaults to 500ms, matching VS Code's `workbench.hover.delay`,
-and tooltips stop growing at half the window height.
+and tooltips stop growing at half the window height. Components that own
+their hovers fall back to a private provider when the app has none, so
+`Tree` rows and `IconButton` work unwrapped. A private provider keeps its own
+skip-delay, though, so an app with several of them makes every hover wait out
+the full delay; mount one provider and they share it. `IconButton` hints with
+its label like a native action bar item; pass `tooltip` to say something else,
+or `null` for a button that stays quiet.
+
+`HoverDelegateScope` hands every `Tooltip` inside it to one shared bubble
+instead of a bubble each, the way a VS Code list serves its rows and their
+action bars from a single hover widget. `Tree` uses it, which is also what
+lets one place decide when a hover is instant rather than delayed.
 
 Overlay content is portalled to `body`, inherits webview typography from
 there, and shares the `.ui-overlay` base for stacking, border, shadow,
-and scrolling. Menus default to the Modern UI motion: they scale and fade in
-from the trigger corner and fade out on close, with Radix holding unmount
-until the exit animation ends. High contrast, `forced-colors`, and
+scrolling, and highlighted rows. Menus default to the Modern UI motion:
+they scale and fade in from the trigger corner and fade out on close, with
+Radix holding unmount until the exit animation ends. High contrast, `forced-colors`, and
 `prefers-reduced-motion` are handled.
 
+## Form controls
+
+`Input`, `Textarea`, `Checkbox`, `Select`, and `Field`/`Label` cover forms
+the way VS Code's own settings editor does: text field, number field,
+checkbox, and dropdown. Richer shapes map onto that vocabulary instead of
+getting bespoke widgets: a switch renders as `Checkbox`, a radio group or
+slider-bounded number as `Select` or a number `Input`, a multi-select as
+stacked `Checkbox` controls inside a `Field`.
+
+`Input` and `Textarea` are controlled with `value` and `onChange(next)`;
+`Checkbox` uses `checked` and `onChange(next)`. Native-element props and
+refs pass through to the control; `className` and `style` target the root.
+`Select` wraps `@radix-ui/react-select` and preserves its controlled
+(`value` / `onValueChange`) and uncontrolled (`defaultValue`) modes, with
+flat compound exports such as `SelectTrigger` and `SelectItem`, as the
+menus do.
+`Input` renders `children` after the control for trailing in-field
+actions; `PasswordInput` uses that slot for a reveal toggle styled like the
+find widget's option buttons.
+
+`Field` lays out a semibold `Label`, children, description, and error text.
+It does not clone children or require a form context, so native elements
+and third-party controls work the same way: connect `htmlFor` to the
+control's `id`, and pass `descriptionId` / `errorId` to give the rendered
+text IDs the control can point `aria-describedby` at. The consumer owns
+`aria-describedby`, `aria-invalid`, validation, and when to announce
+errors. For a group of checkboxes, use a native `fieldset` with a `legend`
+for the group name rather than pointing a single label at several controls.
+
 ## Known gaps
 
 - Overlay shadows are darker than native in dark themes: menus in VS Code
@@ -79,7 +238,6 @@ until the exit animation ends. High contrast, `forced-colors`, and
 - Keybinding hints show the contributed defaults the consumer passes, not
   user remaps: VS Code exposes no API for extensions to resolve a command's
   effective keybinding.
-- List/selection-row tokens are deferred to the Tree suite (#1037).
 
 ## Codicons
 
@@ -91,10 +249,12 @@ without a generated source file or a runtime list in the public API.
 
 ESLint rejects `@repo/*` imports and relative cross-package imports in
 `packages/ui` TypeScript and TSX source. `react` remains a peer dependency;
-the only runtime dependencies are the Radix overlay primitives and
+the only runtime dependencies are the Radix primitives and
 `@vscode/codicons`. Public consumers import from the package root or its
 declared CSS exports.
 
 Shared internals are reached through `package.json` subpath imports (`#cx`,
 `#codicons`, `#storybook`). These resolve only inside this package and ship
-with it, so they survive a standalone NPM split.
+with it, so they survive a standalone NPM split. Component families keep
+their own internals (contexts, stores) inside their folder and import them
+relatively, so a family can lift out wholesale.
diff --git a/packages/ui/package.json b/packages/ui/package.json
index a2ea866658..f027f307c2 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -19,6 +19,7 @@
 	"imports": {
 		"#cx": "./src/cx.ts",
 		"#codicons": "./src/codicons.ts",
+		"#ref": "./src/ref.ts",
 		"#storybook": "./src/storybook.ts"
 	},
 	"scripts": {
@@ -27,6 +28,8 @@
 	"dependencies": {
 		"@radix-ui/react-context-menu": "^2.3.7",
 		"@radix-ui/react-dropdown-menu": "^2.1.24",
+		"@radix-ui/react-select": "^2.3.7",
+		"@radix-ui/react-slot": "^1.3.3",
 		"@radix-ui/react-tooltip": "^1.2.16",
 		"@vscode/codicons": "catalog:"
 	},
diff --git a/packages/ui/src/components/Checkbox/Checkbox.css b/packages/ui/src/components/Checkbox/Checkbox.css
new file mode 100644
index 0000000000..4123f510c9
--- /dev/null
+++ b/packages/ui/src/components/Checkbox/Checkbox.css
@@ -0,0 +1,49 @@
+.ui-checkbox {
+	position: relative;
+	display: inline-flex;
+	align-items: center;
+	gap: 6px;
+	cursor: pointer;
+	user-select: none;
+}
+
+.ui-checkbox:has(> :disabled) {
+	opacity: var(--ui-disabled-opacity);
+	cursor: default;
+}
+
+/* Invisible over the box, keeping the native hit target and focus source */
+.ui-checkbox__input {
+	position: absolute;
+	width: 18px;
+	height: 18px;
+	margin: 0;
+	opacity: 0;
+	cursor: inherit;
+}
+
+/* Native checkbox geometry (checkbox.css): 18px box, 3px parity-pinned radius */
+.ui-checkbox__box {
+	flex: none;
+	width: 18px;
+	height: 18px;
+	color: var(--ui-checkbox-foreground);
+	background: var(--ui-checkbox-background);
+	border: 1px solid var(--ui-checkbox-border);
+	border-radius: 3px;
+}
+
+.ui-checkbox__input:focus + .ui-checkbox__box {
+	border-color: var(--ui-focus-border);
+}
+
+@media (forced-colors: active) {
+	.ui-checkbox__box {
+		color: Highlight;
+		border-color: CanvasText;
+	}
+
+	.ui-checkbox__input:focus + .ui-checkbox__box {
+		border-color: Highlight;
+	}
+}
diff --git a/packages/ui/src/components/Checkbox/Checkbox.stories.tsx b/packages/ui/src/components/Checkbox/Checkbox.stories.tsx
new file mode 100644
index 0000000000..099640eff6
--- /dev/null
+++ b/packages/ui/src/components/Checkbox/Checkbox.stories.tsx
@@ -0,0 +1,46 @@
+import { useState } from "react";
+import { within } from "storybook/test";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import { Checkbox } from "./Checkbox";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+const CheckboxStates = (): React.JSX.Element => {
+	const [checked, setChecked] = useState(true);
+	return (
+		<div style={{ display: "grid", gap: "8px", justifyItems: "start" }}>
+			<Checkbox checked={checked} onChange={setChecked}>
+				Start on connect
+			</Checkbox>
+			<Checkbox checked={false} onChange={() => undefined}>
+				Unchecked
+			</Checkbox>
+			<Checkbox checked disabled onChange={() => undefined}>
+				Disabled checked
+			</Checkbox>
+			<Checkbox checked={false} disabled onChange={() => undefined}>
+				Disabled unchecked
+			</Checkbox>
+		</div>
+	);
+};
+
+const meta: Meta<typeof CheckboxStates> = {
+	title: "UI/Checkbox",
+	component: CheckboxStates,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof CheckboxStates>;
+
+export const States: Story = {};
+
+export const Focused: Story = {
+	play: ({ canvasElement }) => {
+		within(canvasElement)
+			.getByRole("checkbox", { name: "Start on connect" })
+			.focus();
+	},
+};
diff --git a/packages/ui/src/components/Checkbox/Checkbox.tsx b/packages/ui/src/components/Checkbox/Checkbox.tsx
new file mode 100644
index 0000000000..a4adfc5c21
--- /dev/null
+++ b/packages/ui/src/components/Checkbox/Checkbox.tsx
@@ -0,0 +1,43 @@
+import { type ComponentProps } from "react";
+
+import { cx } from "#cx";
+
+import "../control.css";
+import { Icon } from "../Icon/Icon";
+
+import "./Checkbox.css";
+
+export interface CheckboxProps extends Omit<
+	ComponentProps<"input">,
+	"checked" | "onChange" | "type"
+> {
+	checked: boolean;
+	onChange: (checked: boolean) => void;
+}
+
+/* The native input supplies state, focus, and semantics; the box paints
+   VS Code's checkbox geometry and shows a codicon check. */
+export function Checkbox({
+	checked,
+	onChange,
+	className,
+	style,
+	children,
+	...props
+}: CheckboxProps): React.JSX.Element {
+	return (
+		<label className={cx("ui-checkbox", className)} style={style}>
+			<input
+				{...props}
+				type="checkbox"
+				checked={checked}
+				onChange={(event) => onChange(event.currentTarget.checked)}
+				className="ui-checkbox__input"
+			/>
+			<span className="ui-control ui-checkbox__box" aria-hidden="true">
+				{checked && <Icon name="check" />}
+			</span>
+			{children}
+		</label>
+	);
+}
diff --git a/packages/ui/src/components/ContextMenu/ContextMenu.tsx b/packages/ui/src/components/ContextMenu/ContextMenu.tsx
index 951d149f68..93f877f3ec 100644
--- a/packages/ui/src/components/ContextMenu/ContextMenu.tsx
+++ b/packages/ui/src/components/ContextMenu/ContextMenu.tsx
@@ -25,7 +25,7 @@ export const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
 /** One selectable action row; a leading `Icon` sits in the gutter. */
 export const ContextMenuItem = menuPart(
 	ContextMenuPrimitive.Item,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 );
 
 /** Non-interactive heading above a group. */
@@ -43,21 +43,21 @@ export const ContextMenuSeparator = menuPart(
 /** A toggleable row; checked shows a gutter check. */
 export const ContextMenuCheckboxItem = menuPart(
 	ContextMenuPrimitive.CheckboxItem,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 	{ indicator: ContextMenuPrimitive.ItemIndicator },
 );
 
 /** One choice in a radio group. */
 export const ContextMenuRadioItem = menuPart(
 	ContextMenuPrimitive.RadioItem,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 	{ indicator: ContextMenuPrimitive.ItemIndicator },
 );
 
 /** The row that opens its submenu. */
 export const ContextMenuSubTrigger = menuPart(
 	ContextMenuPrimitive.SubTrigger,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 	{ chevron: true },
 );
 
diff --git a/packages/ui/src/components/DropdownMenu/DropdownMenu.tsx b/packages/ui/src/components/DropdownMenu/DropdownMenu.tsx
index 92d3c4b093..017264562c 100644
--- a/packages/ui/src/components/DropdownMenu/DropdownMenu.tsx
+++ b/packages/ui/src/components/DropdownMenu/DropdownMenu.tsx
@@ -25,7 +25,7 @@ export const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
 /** One selectable action row; a leading `Icon` sits in the gutter. */
 export const DropdownMenuItem = menuPart(
 	DropdownMenuPrimitive.Item,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 );
 
 /** Non-interactive heading above a group. */
@@ -43,21 +43,21 @@ export const DropdownMenuSeparator = menuPart(
 /** A toggleable row; checked shows a gutter check. */
 export const DropdownMenuCheckboxItem = menuPart(
 	DropdownMenuPrimitive.CheckboxItem,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 	{ indicator: DropdownMenuPrimitive.ItemIndicator },
 );
 
 /** One choice in a radio group. */
 export const DropdownMenuRadioItem = menuPart(
 	DropdownMenuPrimitive.RadioItem,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 	{ indicator: DropdownMenuPrimitive.ItemIndicator },
 );
 
 /** The row that opens its submenu. */
 export const DropdownMenuSubTrigger = menuPart(
 	DropdownMenuPrimitive.SubTrigger,
-	"ui-menu__item",
+	"ui-overlay__item ui-menu__item",
 	{ chevron: true },
 );
 
diff --git a/packages/ui/src/components/Field/Field.css b/packages/ui/src/components/Field/Field.css
new file mode 100644
index 0000000000..e2af3c4558
--- /dev/null
+++ b/packages/ui/src/components/Field/Field.css
@@ -0,0 +1,18 @@
+.ui-label {
+	display: block;
+	font-weight: var(--ui-font-weight-semibold);
+}
+
+.ui-field {
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+}
+
+.ui-field__description {
+	color: var(--ui-description-foreground);
+}
+
+.ui-field__error {
+	color: var(--ui-error-foreground);
+}
diff --git a/packages/ui/src/components/Field/Field.stories.tsx b/packages/ui/src/components/Field/Field.stories.tsx
new file mode 100644
index 0000000000..8037c606c6
--- /dev/null
+++ b/packages/ui/src/components/Field/Field.stories.tsx
@@ -0,0 +1,57 @@
+import { useId, useState } from "react";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import { Input } from "../Input/Input";
+
+import { Field } from "./Field";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+const FieldStates = (): React.JSX.Element => {
+	const [region, setRegion] = useState("us-pittsburgh");
+	const regionId = useId();
+	const coresId = useId();
+	return (
+		<div style={{ display: "grid", gap: "16px", width: "260px" }}>
+			<Field
+				label="Region"
+				htmlFor={regionId}
+				description="Deploy the workspace close to you."
+				descriptionId={`${regionId}-description`}
+			>
+				<Input
+					id={regionId}
+					value={region}
+					onChange={setRegion}
+					aria-describedby={`${regionId}-description`}
+				/>
+			</Field>
+			<Field
+				label="CPU cores"
+				htmlFor={coresId}
+				error="Value must be between 1 and 16."
+				errorId={`${coresId}-error`}
+			>
+				<Input
+					id={coresId}
+					type="number"
+					value="32"
+					onChange={() => undefined}
+					aria-describedby={`${coresId}-error`}
+					aria-invalid="true"
+				/>
+			</Field>
+		</div>
+	);
+};
+
+const meta: Meta<typeof FieldStates> = {
+	title: "UI/Field",
+	component: FieldStates,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof FieldStates>;
+
+export const States: Story = {};
diff --git a/packages/ui/src/components/Field/Field.tsx b/packages/ui/src/components/Field/Field.tsx
new file mode 100644
index 0000000000..c0c7cc055c
--- /dev/null
+++ b/packages/ui/src/components/Field/Field.tsx
@@ -0,0 +1,53 @@
+import { type ComponentProps, type ReactNode } from "react";
+
+import { cx } from "#cx";
+
+import "./Field.css";
+
+export type LabelProps = ComponentProps<"label">;
+
+export function Label({ className, ...props }: LabelProps): React.JSX.Element {
+	return <label {...props} className={cx("ui-label", className)} />;
+}
+
+export interface FieldProps extends ComponentProps<"div"> {
+	description?: ReactNode;
+	/** ID for the description; associate it with the control via aria-describedby. */
+	descriptionId?: string;
+	error?: ReactNode;
+	/** ID for the error; the consumer owns aria-describedby and aria-invalid. */
+	errorId?: string;
+	htmlFor?: string;
+	label?: ReactNode;
+}
+
+/* Lays out a labelled control like a settings-editor entry: semibold label,
+   control, then muted description or error text. */
+export function Field({
+	label,
+	htmlFor,
+	description,
+	descriptionId,
+	error,
+	errorId,
+	className,
+	children,
+	...props
+}: FieldProps): React.JSX.Element {
+	return (
+		<div {...props} className={cx("ui-field", className)}>
+			{label !== undefined && <Label htmlFor={htmlFor}>{label}</Label>}
+			{children}
+			{description !== undefined && (
+				<div id={descriptionId} className="ui-field__description">
+					{description}
+				</div>
+			)}
+			{error !== undefined && (
+				<div id={errorId} className="ui-field__error">
+					{error}
+				</div>
+			)}
+		</div>
+	);
+}
diff --git a/packages/ui/src/components/Icon/Icon.css b/packages/ui/src/components/Icon/Icon.css
index 42a3429401..9967622c11 100644
--- a/packages/ui/src/components/Icon/Icon.css
+++ b/packages/ui/src/components/Icon/Icon.css
@@ -13,3 +13,8 @@
 		animation: none;
 	}
 }
+
+/* data-pixel is set in .storybook/preview.ts via isPixel(). */
+:root[data-pixel] .ui-icon--spin {
+	animation: none;
+}
diff --git a/packages/ui/src/components/IconButton/IconButton.tsx b/packages/ui/src/components/IconButton/IconButton.tsx
index e5d308661a..27e2f877ad 100644
--- a/packages/ui/src/components/IconButton/IconButton.tsx
+++ b/packages/ui/src/components/IconButton/IconButton.tsx
@@ -1,9 +1,10 @@
-import { type ComponentProps } from "react";
+import { type ComponentProps, type ReactNode } from "react";
 
 import { cx } from "#cx";
 
 import "../control.css";
 import { Icon } from "../Icon/Icon";
+import { Tooltip, TooltipScope } from "../Tooltip/Tooltip";
 
 import "./IconButton.css";
 
@@ -15,18 +16,20 @@ export interface IconButtonProps extends Omit<
 > {
 	icon: CodiconName;
 	label: string;
+	/** Hover content; defaults to the label, `null` opts out. */
+	tooltip?: ReactNode;
 }
 
-/* No default title: native toolbar buttons hint with the styled hover
-   widget, not the browser box. Wrap in Tooltip for that. */
+/* Hints through the hover widget, never the browser title box. */
 export function IconButton({
 	icon,
 	label,
+	tooltip = label,
 	className,
 	type = "button",
 	...props
 }: IconButtonProps): React.JSX.Element {
-	return (
+	const button = (
 		<button
 			{...props}
 			type={type}
@@ -36,4 +39,10 @@ export function IconButton({
 			<Icon name={icon} />
 		</button>
 	);
+	if (!tooltip) return button;
+	return (
+		<TooltipScope>
+			<Tooltip content={tooltip}>{button}</Tooltip>
+		</TooltipScope>
+	);
 }
diff --git a/packages/ui/src/components/Input/Input.css b/packages/ui/src/components/Input/Input.css
new file mode 100644
index 0000000000..017a8faac0
--- /dev/null
+++ b/packages/ui/src/components/Input/Input.css
@@ -0,0 +1,9 @@
+.ui-input__control {
+	padding: 0 6px;
+}
+
+/* Native VS Code number fields are plain inputs without spinners */
+.ui-input__control::-webkit-inner-spin-button,
+.ui-input__control::-webkit-outer-spin-button {
+	display: none;
+}
diff --git a/packages/ui/src/components/Input/Input.stories.tsx b/packages/ui/src/components/Input/Input.stories.tsx
new file mode 100644
index 0000000000..97bc87fe13
--- /dev/null
+++ b/packages/ui/src/components/Input/Input.stories.tsx
@@ -0,0 +1,53 @@
+import { useState } from "react";
+import { within } from "storybook/test";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import { Input } from "./Input";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+const InputStates = (): React.JSX.Element => {
+	const [value, setValue] = useState("us-pittsburgh");
+	return (
+		<div style={{ display: "grid", gap: "8px", width: "260px" }}>
+			<Input value={value} onChange={setValue} aria-label="Region" />
+			<Input
+				value=""
+				onChange={() => undefined}
+				placeholder="Instance type"
+				aria-label="Placeholder"
+			/>
+			<Input
+				value="8"
+				onChange={() => undefined}
+				type="number"
+				min={1}
+				max={16}
+				aria-label="CPU cores"
+			/>
+			<Input
+				value="read-only"
+				onChange={() => undefined}
+				disabled
+				aria-label="Disabled"
+			/>
+		</div>
+	);
+};
+
+const meta: Meta<typeof InputStates> = {
+	title: "UI/Input",
+	component: InputStates,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof InputStates>;
+
+export const States: Story = {};
+
+export const Focused: Story = {
+	play: ({ canvasElement }) => {
+		within(canvasElement).getByRole("textbox", { name: "Region" }).focus();
+	},
+};
diff --git a/packages/ui/src/components/Input/Input.tsx b/packages/ui/src/components/Input/Input.tsx
new file mode 100644
index 0000000000..db461a2346
--- /dev/null
+++ b/packages/ui/src/components/Input/Input.tsx
@@ -0,0 +1,42 @@
+import { type ComponentProps } from "react";
+
+import { cx } from "#cx";
+
+import "../control.css";
+import "../text-control.css";
+
+import "./Input.css";
+
+/** `children` render after the control as trailing in-field content, such
+    as the reveal toggle in `PasswordInput`. */
+export interface InputProps extends Omit<
+	ComponentProps<"input">,
+	"onChange" | "value"
+> {
+	onChange: (value: string) => void;
+	value: string;
+}
+
+export function Input({
+	value,
+	onChange,
+	className,
+	style,
+	children,
+	...props
+}: InputProps): React.JSX.Element {
+	return (
+		<div
+			className={cx("ui-control", "ui-text-control", "ui-input", className)}
+			style={style}
+		>
+			<input
+				{...props}
+				value={value}
+				onChange={(event) => onChange(event.currentTarget.value)}
+				className="ui-text-control__control ui-input__control"
+			/>
+			{children}
+		</div>
+	);
+}
diff --git a/packages/ui/src/components/Menu/Menu.css b/packages/ui/src/components/Menu/Menu.css
index c4a10c0e0a..d0ca4e4a81 100644
--- a/packages/ui/src/components/Menu/Menu.css
+++ b/packages/ui/src/components/Menu/Menu.css
@@ -7,6 +7,9 @@
 		--radix-dropdown-menu-content-available-height,
 		var(--radix-context-menu-content-available-height)
 	);
+	--ui-overlay-highlight-background: var(--ui-menu-highlight-background);
+	--ui-overlay-highlight-foreground: var(--ui-menu-highlight-foreground);
+	--ui-overlay-highlight-outline: var(--ui-menu-selection-border);
 
 	/* Native .monaco-menu min-width */
 	min-width: 160px;
@@ -30,25 +33,6 @@
 	position: relative;
 	line-height: 1;
 	white-space: nowrap;
-	border-radius: var(--ui-radius-medium);
-	cursor: default;
-	user-select: none;
-	outline: 1px solid transparent;
-	outline-offset: -1px;
-}
-
-/* An open submenu keeps its parent highlighted, like native; the selection
-   border only resolves in high contrast. */
-.ui-menu__item[data-highlighted],
-.ui-menu__item[data-state="open"] {
-	forced-color-adjust: none;
-	color: var(--ui-menu-highlight-foreground);
-	background: var(--ui-menu-highlight-background);
-	outline-color: var(--ui-menu-selection-border);
-}
-
-.ui-menu__item[data-disabled] {
-	color: var(--ui-disabled-foreground);
 }
 
 /* Left gutter, like the native menu-item-check; a checked item's check is
@@ -140,17 +124,15 @@
 	}
 }
 
-@media (forced-colors: active) {
-	.ui-menu__item[data-highlighted],
-	.ui-menu__item[data-state="open"] {
-		color: HighlightText;
-		background: Highlight;
-	}
-
-	.ui-menu__item[data-disabled] {
-		color: GrayText;
+/* data-pixel is set in .storybook/preview.ts via isPixel(). */
+@media (prefers-reduced-motion: no-preference) {
+	:where(:root[data-pixel]) .ui-menu[data-state="open"],
+	:where(:root[data-pixel]) .ui-menu[data-state="closed"] {
+		animation: none;
 	}
+}
 
+@media (forced-colors: active) {
 	.ui-menu__separator {
 		background: CanvasText;
 	}
diff --git a/packages/ui/src/components/PasswordInput/PasswordInput.stories.tsx b/packages/ui/src/components/PasswordInput/PasswordInput.stories.tsx
new file mode 100644
index 0000000000..b047ab644c
--- /dev/null
+++ b/packages/ui/src/components/PasswordInput/PasswordInput.stories.tsx
@@ -0,0 +1,54 @@
+import { useState } from "react";
+import { userEvent, within } from "storybook/test";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import { PasswordInput } from "./PasswordInput";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+const PasswordInputStates = (): React.JSX.Element => {
+	const [secret, setSecret] = useState("hunter2");
+	return (
+		<div style={{ display: "grid", gap: "8px", width: "260px" }}>
+			<PasswordInput
+				value={secret}
+				onChange={setSecret}
+				aria-label="API token"
+			/>
+			<PasswordInput
+				value="hunter2"
+				onChange={() => undefined}
+				disabled
+				aria-label="Disabled"
+			/>
+		</div>
+	);
+};
+
+const meta: Meta<typeof PasswordInputStates> = {
+	title: "UI/PasswordInput",
+	component: PasswordInputStates,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof PasswordInputStates>;
+
+export const States: Story = {};
+
+export const Revealed: Story = {
+	render: () => (
+		<div style={{ width: "260px" }}>
+			<PasswordInput
+				value="hunter2"
+				onChange={() => undefined}
+				aria-label="API token"
+			/>
+		</div>
+	),
+	play: async ({ canvasElement }) => {
+		await userEvent.click(
+			within(canvasElement).getByRole("button", { name: "Show value" }),
+		);
+	},
+};
diff --git a/packages/ui/src/components/PasswordInput/PasswordInput.tsx b/packages/ui/src/components/PasswordInput/PasswordInput.tsx
new file mode 100644
index 0000000000..30d7c82c0a
--- /dev/null
+++ b/packages/ui/src/components/PasswordInput/PasswordInput.tsx
@@ -0,0 +1,35 @@
+import { useState } from "react";
+
+import { IconButton } from "../IconButton/IconButton";
+import { Input, type InputProps } from "../Input/Input";
+
+export interface PasswordInputProps extends Omit<
+	InputProps,
+	"children" | "type"
+> {
+	hideValueLabel?: string;
+	showValueLabel?: string;
+}
+
+/* A masked Input with a reveal toggle, styled like the find widget's
+   in-field option buttons. */
+export function PasswordInput({
+	showValueLabel = "Show value",
+	hideValueLabel = "Hide value",
+	disabled,
+	...props
+}: PasswordInputProps): React.JSX.Element {
+	const [revealed, setRevealed] = useState(false);
+	return (
+		<Input {...props} type={revealed ? "text" : "password"} disabled={disabled}>
+			<IconButton
+				className="ui-text-control__action"
+				icon={revealed ? "eye-closed" : "eye"}
+				label={revealed ? hideValueLabel : showValueLabel}
+				aria-pressed={revealed}
+				disabled={disabled}
+				onClick={() => setRevealed(!revealed)}
+			/>
+		</Input>
+	);
+}
diff --git a/packages/ui/src/components/ProgressBar/ProgressBar.css b/packages/ui/src/components/ProgressBar/ProgressBar.css
index dc31caec85..5dcdd4453b 100644
--- a/packages/ui/src/components/ProgressBar/ProgressBar.css
+++ b/packages/ui/src/components/ProgressBar/ProgressBar.css
@@ -52,3 +52,8 @@
 		background: Highlight;
 	}
 }
+
+/* data-pixel is set in .storybook/preview.ts via isPixel(). */
+:root[data-pixel] .ui-progress-bar--indeterminate .ui-progress-bar__indicator {
+	animation: none;
+}
diff --git a/packages/ui/src/components/SearchInput/SearchInput.css b/packages/ui/src/components/SearchInput/SearchInput.css
index 1218b0e7c3..edf7d575f2 100644
--- a/packages/ui/src/components/SearchInput/SearchInput.css
+++ b/packages/ui/src/components/SearchInput/SearchInput.css
@@ -1,51 +1,11 @@
 .ui-search-input {
-	justify-content: flex-start;
-	width: 100%;
-	height: 26px;
 	padding-inline-start: 2px;
-	color: var(--ui-input-foreground);
-	background: var(--ui-input-background);
-	border: 1px solid var(--ui-input-border);
-	border-radius: var(--ui-radius-small);
-}
-
-.ui-search-input:focus-within {
-	border-color: var(--ui-focus-border);
-}
-
-.ui-search-input > .ui-icon {
-	flex: none;
 }
 
 .ui-search-input__control {
-	min-width: 0;
-	flex: 1;
 	padding: 0 4px;
-	color: inherit;
-	background: transparent;
-	border: 0;
-	outline: 0;
-	font: inherit;
-}
-
-.ui-search-input__control::placeholder {
-	color: var(--ui-input-placeholder-foreground);
-	opacity: 1;
 }
 
 .ui-search-input__control::-webkit-search-cancel-button {
 	display: none;
 }
-
-.ui-search-input__clear {
-	flex: none;
-	margin-inline-end: 1px;
-}
-
-.ui-search-input--disabled {
-	opacity: var(--ui-disabled-opacity);
-}
-
-.ui-search-input__control:disabled {
-	cursor: not-allowed;
-}
diff --git a/packages/ui/src/components/SearchInput/SearchInput.tsx b/packages/ui/src/components/SearchInput/SearchInput.tsx
index 154ffaefce..b488979d8b 100644
--- a/packages/ui/src/components/SearchInput/SearchInput.tsx
+++ b/packages/ui/src/components/SearchInput/SearchInput.tsx
@@ -1,10 +1,12 @@
 import { type ChangeEvent, type ComponentProps, useRef } from "react";
 
 import { cx } from "#cx";
+import { setForwardedRef } from "#ref";
 
 import "../control.css";
 import { Icon } from "../Icon/Icon";
 import { IconButton } from "../IconButton/IconButton";
+import "../text-control.css";
 
 import "./SearchInput.css";
 
@@ -42,8 +44,8 @@ export function SearchInput({
 		<div
 			className={cx(
 				"ui-control",
+				"ui-text-control",
 				"ui-search-input",
-				disabled && "ui-search-input--disabled",
 				className,
 			)}
 			style={style}
@@ -54,25 +56,20 @@ export function SearchInput({
 				// Track the node for clear-and-refocus, honoring the consumer ref
 				ref={(node) => {
 					inputRef.current = node;
-					if (typeof ref === "function") {
-						return ref(node);
-					}
-					if (ref) {
-						ref.current = node;
-					}
+					setForwardedRef(ref, node);
 				}}
 				type="search"
 				value={value}
 				onChange={handleChange}
 				disabled={disabled}
 				aria-label={label}
-				className="ui-search-input__control"
+				className="ui-text-control__control ui-search-input__control"
 			/>
 			{value.length > 0 && !disabled ? (
 				<IconButton
 					icon="close"
 					label={clearLabel}
-					className="ui-search-input__clear"
+					className="ui-text-control__action"
 					onClick={handleClear}
 				/>
 			) : null}
diff --git a/packages/ui/src/components/Select/Select.css b/packages/ui/src/components/Select/Select.css
new file mode 100644
index 0000000000..c3f057794f
--- /dev/null
+++ b/packages/ui/src/components/Select/Select.css
@@ -0,0 +1,68 @@
+.ui-select__trigger {
+	justify-content: space-between;
+	gap: 6px;
+	width: 100%;
+	height: 26px;
+	padding: 0 6px;
+	color: var(--ui-dropdown-foreground);
+	background: var(--ui-dropdown-background);
+	border: 1px solid var(--ui-dropdown-border);
+	border-radius: var(--ui-radius-small);
+	/* The ellipsized value clips vertically at the .ui-control line-height of 1 */
+	line-height: normal;
+	cursor: pointer;
+	outline: 0;
+}
+
+.ui-select__trigger:focus {
+	border-color: var(--ui-focus-border);
+}
+
+.ui-select__trigger[data-placeholder] {
+	color: var(--ui-input-placeholder-foreground);
+}
+
+.ui-select__trigger > :not(.ui-icon) {
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+.ui-select__list {
+	--ui-overlay-border: var(--ui-dropdown-border);
+	--ui-overlay-available-height: var(--radix-select-content-available-height);
+	--ui-overlay-highlight-background: var(--ui-dropdown-list-focus-background);
+	--ui-overlay-highlight-foreground: var(--ui-dropdown-list-focus-foreground);
+	--ui-overlay-highlight-outline: var(--ui-list-selection-outline);
+
+	min-width: var(--radix-select-trigger-width);
+	padding: 2px;
+	color: var(--ui-dropdown-foreground);
+	background: var(--ui-dropdown-list-background);
+}
+
+/* Radix hides viewport scrollbars for its optional scroll buttons. */
+.ui-select__list [data-radix-select-viewport] {
+	scrollbar-width: auto;
+}
+
+.ui-select__list [data-radix-select-viewport]::-webkit-scrollbar {
+	display: block;
+}
+
+.ui-select__item {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	min-height: 22px;
+	padding: 2px 6px;
+	line-height: 1.4;
+}
+
+.ui-select__item-description {
+	color: var(--ui-description-foreground);
+	font-size: var(--ui-font-size-small);
+}
+
+.ui-select__item[data-highlighted] .ui-select__item-description {
+	color: inherit;
+}
diff --git a/packages/ui/src/components/Select/Select.stories.tsx b/packages/ui/src/components/Select/Select.stories.tsx
new file mode 100644
index 0000000000..825f99d34d
--- /dev/null
+++ b/packages/ui/src/components/Select/Select.stories.tsx
@@ -0,0 +1,109 @@
+import { useState } from "react";
+import { screen, userEvent, within } from "storybook/test";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import {
+	Select,
+	SelectContent,
+	SelectItem,
+	SelectTrigger,
+	SelectValue,
+} from "./Select";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+const RegionSelect = (): React.JSX.Element => {
+	const [region, setRegion] = useState("us-pittsburgh");
+	return (
+		<div style={{ display: "grid", gap: "8px", width: "260px" }}>
+			<Select value={region} onValueChange={setRegion}>
+				<SelectTrigger aria-label="Region">
+					<SelectValue placeholder="Select a region" />
+				</SelectTrigger>
+				<SelectContent>
+					<SelectItem value="us-pittsburgh" description="Lowest latency">
+						US East (Pittsburgh)
+					</SelectItem>
+					<SelectItem value="eu-helsinki">EU North (Helsinki)</SelectItem>
+					<SelectItem value="ap-sydney" disabled>
+						Asia Pacific (Sydney)
+					</SelectItem>
+				</SelectContent>
+			</Select>
+			<Select value="" onValueChange={() => undefined}>
+				<SelectTrigger aria-label="Placeholder">
+					<SelectValue placeholder="Select an option" />
+				</SelectTrigger>
+				<SelectContent>
+					<SelectItem value="one">One</SelectItem>
+				</SelectContent>
+			</Select>
+			<Select value="one" onValueChange={() => undefined} disabled>
+				<SelectTrigger aria-label="Disabled">
+					<SelectValue />
+				</SelectTrigger>
+				<SelectContent>
+					<SelectItem value="one">One</SelectItem>
+				</SelectContent>
+			</Select>
+		</div>
+	);
+};
+
+const meta: Meta<typeof RegionSelect> = {
+	title: "UI/Select",
+	component: RegionSelect,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof RegionSelect>;
+
+export const States: Story = {};
+
+export const Focused: Story = {
+	play: ({ canvasElement }) => {
+		within(canvasElement).getByRole("combobox", { name: "Region" }).focus();
+	},
+};
+
+export const Open: Story = {
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+		await userEvent.click(canvas.getByRole("combobox", { name: "Region" }));
+		await screen.findByRole("listbox");
+	},
+};
+
+export const LongList: Story = {
+	render: () => (
+		<div style={{ width: "180px" }}>
+			<Select defaultValue="0">
+				<SelectTrigger aria-label="Workspace pool">
+					<SelectValue />
+				</SelectTrigger>
+				<SelectContent style={{ maxHeight: "150px" }}>
+					{Array.from({ length: 20 }, (_, index) => (
+						<SelectItem
+							key={index}
+							value={String(index)}
+							disabled={index === 1}
+						>
+							{index === 0
+								? "US East (Pittsburgh), dedicated high-memory workspace pool"
+								: `Pool ${index}`}
+						</SelectItem>
+					))}
+				</SelectContent>
+			</Select>
+		</div>
+	),
+	// Scroll to the end of the list so the snapshot shows a scrolled viewport.
+	play: async ({ canvasElement }) => {
+		await userEvent.click(
+			within(canvasElement).getByRole("combobox", { name: "Workspace pool" }),
+		);
+		await screen.findByRole("listbox");
+		await userEvent.keyboard("{End}");
+	},
+};
diff --git a/packages/ui/src/components/Select/Select.tsx b/packages/ui/src/components/Select/Select.tsx
new file mode 100644
index 0000000000..dfa0bdb987
--- /dev/null
+++ b/packages/ui/src/components/Select/Select.tsx
@@ -0,0 +1,90 @@
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { useId, type ComponentPropsWithRef, type ReactNode } from "react";
+
+import { cx } from "#cx";
+
+import "../control.css";
+import { Icon } from "../Icon/Icon";
+import "../overlay.css";
+
+import "./Select.css";
+
+export const Select = SelectPrimitive.Root;
+
+/** Renders the selected item's text, or `placeholder` when empty. */
+export const SelectValue = SelectPrimitive.Value;
+
+/** The closed control: current value and a chevron, styled like the
+    native dropdown. */
+export function SelectTrigger({
+	className,
+	children,
+	...props
+}: ComponentPropsWithRef<typeof SelectPrimitive.Trigger>): React.JSX.Element {
+	return (
+		<SelectPrimitive.Trigger
+			{...props}
+			className={cx("ui-control", "ui-select__trigger", className)}
+		>
+			{children}
+			<SelectPrimitive.Icon asChild>
+				<Icon name="chevron-down" />
+			</SelectPrimitive.Icon>
+		</SelectPrimitive.Trigger>
+	);
+}
+
+/** The floating option list, portalled to `body` and sized to the trigger.
+    Like the native select dropdown it appears without animation. */
+export function SelectContent({
+	className,
+	children,
+	...props
+}: ComponentPropsWithRef<typeof SelectPrimitive.Content>): React.JSX.Element {
+	return (
+		<SelectPrimitive.Portal>
+			<SelectPrimitive.Content
+				position="popper"
+				sideOffset={2}
+				{...props}
+				className={cx("ui-overlay", "ui-select__list", className)}
+			>
+				<SelectPrimitive.Viewport>{children}</SelectPrimitive.Viewport>
+			</SelectPrimitive.Content>
+		</SelectPrimitive.Portal>
+	);
+}
+
+export interface SelectItemProps extends ComponentPropsWithRef<
+	typeof SelectPrimitive.Item
+> {
+	description?: ReactNode;
+}
+
+/** One option row; the highlighted row marks selection, like the native
+    list. An optional description renders as a muted second line. */
+export function SelectItem({
+	className,
+	children,
+	description,
+	"aria-describedby": describedBy,
+	...props
+}: SelectItemProps): React.JSX.Element {
+	const descriptionId = useId();
+	return (
+		<SelectPrimitive.Item
+			{...props}
+			className={cx("ui-overlay__item", "ui-select__item", className)}
+			aria-describedby={
+				cx(describedBy, description !== undefined && descriptionId) || undefined
+			}
+		>
+			<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
+			{description !== undefined && (
+				<span id={descriptionId} className="ui-select__item-description">
+					{description}
+				</span>
+			)}
+		</SelectPrimitive.Item>
+	);
+}
diff --git a/packages/ui/src/components/Spinner/Spinner.css b/packages/ui/src/components/Spinner/Spinner.css
index 023c91a016..eb32eb4ba4 100644
--- a/packages/ui/src/components/Spinner/Spinner.css
+++ b/packages/ui/src/components/Spinner/Spinner.css
@@ -50,3 +50,8 @@
 		border-inline-end-color: Highlight;
 	}
 }
+
+/* data-pixel is set in .storybook/preview.ts via isPixel(). */
+:root[data-pixel] .ui-spinner {
+	animation: none;
+}
diff --git a/packages/ui/src/components/Textarea/Textarea.css b/packages/ui/src/components/Textarea/Textarea.css
new file mode 100644
index 0000000000..92db46e5c6
--- /dev/null
+++ b/packages/ui/src/components/Textarea/Textarea.css
@@ -0,0 +1,13 @@
+.ui-textarea {
+	box-sizing: border-box;
+	display: block;
+	min-height: 60px;
+	padding: 4px 6px;
+	font: inherit;
+	outline: 0;
+	resize: vertical;
+}
+
+.ui-textarea:disabled {
+	resize: none;
+}
diff --git a/packages/ui/src/components/Textarea/Textarea.stories.tsx b/packages/ui/src/components/Textarea/Textarea.stories.tsx
new file mode 100644
index 0000000000..b6374b2bc8
--- /dev/null
+++ b/packages/ui/src/components/Textarea/Textarea.stories.tsx
@@ -0,0 +1,45 @@
+import { useState } from "react";
+import { within } from "storybook/test";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import { Textarea } from "./Textarea";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+const TextareaStates = (): React.JSX.Element => {
+	const [value, setValue] = useState("#!/bin/sh\necho hello");
+	return (
+		<div style={{ display: "grid", gap: "8px", width: "260px" }}>
+			<Textarea value={value} onChange={setValue} aria-label="Init script" />
+			<Textarea
+				value=""
+				onChange={() => undefined}
+				placeholder="Optional notes"
+				aria-label="Placeholder"
+			/>
+			<Textarea
+				value="read-only"
+				onChange={() => undefined}
+				disabled
+				aria-label="Disabled"
+			/>
+		</div>
+	);
+};
+
+const meta: Meta<typeof TextareaStates> = {
+	title: "UI/Textarea",
+	component: TextareaStates,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof TextareaStates>;
+
+export const States: Story = {};
+
+export const Focused: Story = {
+	play: ({ canvasElement }) => {
+		within(canvasElement).getByRole("textbox", { name: "Init script" }).focus();
+	},
+};
diff --git a/packages/ui/src/components/Textarea/Textarea.tsx b/packages/ui/src/components/Textarea/Textarea.tsx
new file mode 100644
index 0000000000..163b28e5cf
--- /dev/null
+++ b/packages/ui/src/components/Textarea/Textarea.tsx
@@ -0,0 +1,31 @@
+import { type ComponentProps } from "react";
+
+import { cx } from "#cx";
+
+import "../text-control.css";
+
+import "./Textarea.css";
+
+export interface TextareaProps extends Omit<
+	ComponentProps<"textarea">,
+	"onChange" | "value"
+> {
+	onChange: (value: string) => void;
+	value: string;
+}
+
+export function Textarea({
+	value,
+	onChange,
+	className,
+	...props
+}: TextareaProps): React.JSX.Element {
+	return (
+		<textarea
+			{...props}
+			value={value}
+			onChange={(event) => onChange(event.currentTarget.value)}
+			className={cx("ui-text-control", "ui-textarea", className)}
+		/>
+	);
+}
diff --git a/packages/ui/src/components/Tooltip/Tooltip.tsx b/packages/ui/src/components/Tooltip/Tooltip.tsx
index 68a285c53a..41bd97b748 100644
--- a/packages/ui/src/components/Tooltip/Tooltip.tsx
+++ b/packages/ui/src/components/Tooltip/Tooltip.tsx
@@ -1,4 +1,13 @@
+import { Slot } from "@radix-ui/react-slot";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import {
+	createContext,
+	use,
+	type ComponentProps,
+	type ComponentPropsWithRef,
+	type PointerEvent,
+	type ReactNode,
+} from "react";
 
 import { cx } from "#cx";
 
@@ -6,21 +15,75 @@ import "../overlay.css";
 
 import "./Tooltip.css";
 
-import type { ComponentProps, ComponentPropsWithRef, ReactNode } from "react";
-
 export type TooltipProviderProps = ComponentProps<
 	typeof TooltipPrimitive.Provider
 >;
 
+/** VS Code's `workbench.hover.delay`. */
+const DEFAULT_DELAY_MS = 500;
+
 /**
  * App-level tooltip context; `Tooltip` throws without one. Sharing a single
  * provider lets a pointer moving between nearby triggers skip the show delay,
- * like native hovers. The default delay is VS Code's `workbench.hover.delay`.
+ * like native hovers.
  */
-export function TooltipProvider(
-	props: TooltipProviderProps,
-): React.JSX.Element {
-	return <TooltipPrimitive.Provider delayDuration={500} {...props} />;
+export function TooltipProvider({
+	delayDuration = DEFAULT_DELAY_MS,
+	...props
+}: TooltipProviderProps): React.JSX.Element {
+	return (
+		<TooltipContext value={delayDuration}>
+			<TooltipPrimitive.Provider delayDuration={delayDuration} {...props} />
+		</TooltipContext>
+	);
+}
+
+const TooltipContext = createContext<number | null>(null);
+
+/** Owns tooltips without forcing a provider on consumers; defers to any app-level one. */
+export function TooltipScope({ children }: { children: ReactNode }): ReactNode {
+	return use(TooltipContext) === null ? (
+		<TooltipProvider>{children}</TooltipProvider>
+	) : (
+		children
+	);
+}
+
+/** The surrounding provider's show delay, for surfaces that time their own. */
+export function useTooltipDelay(): number {
+	return use(TooltipContext) ?? DEFAULT_DELAY_MS;
+}
+
+export interface HoverTarget {
+	readonly content: ReactNode;
+	readonly element: HTMLElement;
+}
+
+/** `immediate` skips the show delay or dismisses without a leave grace period. */
+export type HoverDelegate = (
+	target: HoverTarget | undefined,
+	immediate?: boolean,
+) => void;
+
+const HoverDelegateContext = createContext<HoverDelegate | undefined>(
+	undefined,
+);
+
+/**
+ * Hands every `Tooltip` inside to one shared bubble, the way a VS Code list
+ * serves its rows and their action bars from a single hover widget. Pass
+ * `undefined` to hand them back.
+ */
+export function HoverDelegateScope({
+	delegate,
+	children,
+}: {
+	delegate: HoverDelegate | undefined;
+	children: ReactNode;
+}): React.JSX.Element {
+	return (
+		<HoverDelegateContext value={delegate}>{children}</HoverDelegateContext>
+	);
 }
 
 export interface TooltipProps extends Omit<
@@ -30,6 +93,8 @@ export interface TooltipProps extends Omit<
 	content: ReactNode;
 	/** The trigger element; must accept a forwarded ref (asChild). */
 	children: ReactNode;
+	open?: boolean;
+	onOpenChange?: (open: boolean) => void;
 }
 
 /** Hover bubble matching the native hover widget; requires a `TooltipProvider` ancestor. */
@@ -37,15 +102,32 @@ export function Tooltip({
 	content,
 	children,
 	className,
+	open,
+	onOpenChange,
 	...props
 }: TooltipProps): React.JSX.Element {
+	const delegate = use(HoverDelegateContext);
+	if (delegate) {
+		return (
+			<Slot
+				onPointerEnter={(event: PointerEvent<HTMLElement>) =>
+					delegate({ content, element: event.currentTarget })
+				}
+				onPointerLeave={() => delegate(undefined)}
+			>
+				{children}
+			</Slot>
+		);
+	}
 	return (
-		<TooltipPrimitive.Root>
+		<TooltipPrimitive.Root open={open} onOpenChange={onOpenChange}>
 			<TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>
 			<TooltipPrimitive.Portal>
 				<TooltipPrimitive.Content
-					// Native hovers sit flush with the target, left-aligned
-					align="start"
+					// Native sits a hover 2px into the bottom edge of its target.
+					side="bottom"
+					sideOffset={-2}
+					align="center"
 					collisionPadding={8}
 					{...props}
 					className={cx("ui-overlay ui-tooltip", className)}
diff --git a/packages/ui/src/components/Tree/Tree.css b/packages/ui/src/components/Tree/Tree.css
new file mode 100644
index 0000000000..ebce965035
--- /dev/null
+++ b/packages/ui/src/components/Tree/Tree.css
@@ -0,0 +1,222 @@
+/*
+ * Row state reads from the ARIA the rows already declare. The `:not()` on hover
+ * mirrors native's `.monaco-list-row:hover:not(.selected):not(.focused)`: a
+ * selected or focused row keeps its own paint.
+ */
+
+.ui-tree {
+	--ui-tree-indent-size: 8px;
+	--ui-tree-row-height: 22px;
+	position: relative;
+	width: 100%;
+	min-width: 0;
+	outline: 0;
+}
+
+.ui-tree-item {
+	outline: 0;
+}
+
+.ui-tree-item__row {
+	position: relative;
+	display: flex;
+	align-items: center;
+	height: var(--ui-tree-row-height);
+	padding-inline-end: var(--ui-spacing-120);
+	background: transparent;
+	cursor: pointer;
+	user-select: none;
+}
+
+/* A zero-height sticky anchor: the browser pins it, the scroll listener only
+   decides which rows it shows. */
+.ui-tree-sticky {
+	position: sticky;
+	top: 0;
+	/* Native pins the sticky container below the hover widget's stacking */
+	z-index: 13;
+	height: 0;
+	outline: 0;
+}
+
+.ui-tree-sticky__rows {
+	position: absolute;
+	inset-inline: 0;
+	overflow: hidden;
+}
+
+.ui-tree-sticky__shadow {
+	position: absolute;
+	inset-inline: 0;
+	height: 3px;
+	box-shadow: var(--ui-tree-sticky-shadow) 0 6px 6px -6px inset;
+	pointer-events: none;
+}
+
+.ui-tree-sticky__rows > .ui-tree-item {
+	position: absolute;
+	inset-inline: 0;
+	background: var(--ui-tree-sticky-background);
+}
+
+/* Pinned copies show indentation, never guide rails, like the native widget;
+   without this the tree-wide hover rule lights them up. */
+.ui-tree-sticky .ui-tree-item__indent {
+	display: none;
+}
+
+.ui-tree-item:not([aria-selected="true"], .ui-tree-item--focused)
+	> .ui-tree-item__row:hover {
+	color: var(--ui-list-hover-foreground);
+	background: var(--ui-list-hover-background);
+	outline: 1px dashed var(--ui-list-hover-outline);
+	outline-offset: -1px;
+}
+
+.ui-tree-item[aria-selected="true"] > .ui-tree-item__row {
+	color: var(--ui-list-inactive-selection-foreground);
+	background: var(--ui-list-inactive-selection-background);
+	outline: 1px dotted var(--ui-list-selection-outline);
+	outline-offset: -1px;
+}
+
+.ui-tree--focused .ui-tree-item[aria-selected="true"] > .ui-tree-item__row {
+	color: var(--ui-list-active-selection-foreground);
+	background: var(--ui-list-active-selection-background);
+}
+
+/* The native list's inactive focus outline: kept while the tree is blurred. */
+.ui-tree:not(.ui-tree--focused) .ui-tree-item--focused > .ui-tree-item__row {
+	outline: 1px dotted var(--ui-list-inactive-focus-outline);
+	outline-offset: -1px;
+}
+
+.ui-tree--focused .ui-tree-item--focused > .ui-tree-item__row {
+	outline: 1px solid var(--ui-list-focus-outline);
+	outline-offset: -1px;
+}
+
+.ui-tree--focused
+	.ui-tree-item--focused[aria-selected="true"]
+	> .ui-tree-item__row {
+	outline-color: var(--ui-list-focus-and-selection-outline);
+}
+
+.ui-tree-item__indent {
+	position: absolute;
+	inset-block: 0;
+	inset-inline-start: calc(2 * var(--ui-tree-indent-size));
+	display: flex;
+	pointer-events: none;
+}
+
+/* One guide per ancestor, like the native tree's .indent-guide. */
+.ui-tree-item__indent-slot {
+	box-sizing: border-box;
+	width: var(--ui-tree-indent-size);
+	flex: none;
+	border-inline-start: 1px solid transparent;
+}
+
+/* Never overlapping selectors, so neither can override the other. */
+.ui-tree-item__indent-slot--active {
+	border-inline-start-color: var(--ui-tree-indent-guide-active);
+}
+
+.ui-tree:hover
+	.ui-tree-item__indent-slot:not(.ui-tree-item__indent-slot--active) {
+	border-inline-start-color: var(--ui-tree-indent-guide-inactive);
+}
+
+.ui-tree-item__chevron {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 16px;
+	height: var(--ui-tree-row-height);
+	padding-inline-start: calc(var(--ui-tree-level) * var(--ui-tree-indent-size));
+	padding-inline-end: 6px;
+	flex: none;
+	transform: translateX(3px);
+}
+
+.ui-tree-item__chevron:dir(rtl) {
+	transform: translateX(-3px);
+}
+
+.ui-tree-item__chevron > .ui-icon {
+	width: 10px;
+	font-size: 10px;
+}
+
+/* Keep 3px so leaf icons clear the innermost guide and line up with twisties. */
+.ui-tree--explorer
+	.ui-tree-item:not([aria-expanded])
+	> .ui-tree-item__row
+	> .ui-tree-item__chevron {
+	width: 3px;
+	padding-inline-end: 0;
+	visibility: hidden;
+}
+
+.ui-tree-item__content {
+	display: flex;
+	align-items: center;
+	min-width: 0;
+	flex: 1;
+	line-height: var(--ui-tree-row-height);
+	overflow: hidden;
+	white-space: nowrap;
+}
+
+.ui-tree-item__content > .ui-icon {
+	margin-inline-end: var(--ui-spacing-60);
+	flex: none;
+}
+
+.ui-tree-item__action {
+	display: none;
+	align-items: center;
+	align-self: stretch;
+	flex: none;
+	gap: 2px;
+}
+
+.ui-tree-item:is([aria-selected="true"], .ui-tree-item--focused)
+	> .ui-tree-item__row
+	.ui-tree-item__action,
+.ui-tree-item__row:is(:hover, :focus-within) .ui-tree-item__action {
+	display: inline-flex;
+}
+
+/* Modern UI insets the rows; data-ui-style="stable" keeps them edge to edge. */
+:where(:root:not([data-ui-style="stable"])) .ui-tree-item__row {
+	margin-inline: var(--ui-spacing-40);
+	border-radius: var(--ui-radius-small);
+}
+
+@media (prefers-reduced-motion: no-preference) {
+	.ui-tree-item__indent-slot {
+		transition: border-color 100ms linear;
+	}
+}
+
+@media (forced-colors: active) {
+	.ui-tree-item:not([aria-selected="true"]) > .ui-tree-item__row:hover,
+	.ui-tree-item[aria-selected="true"] > .ui-tree-item__row {
+		color: HighlightText;
+		background: Highlight;
+	}
+
+	.ui-tree:hover .ui-tree-item__indent-slot,
+	.ui-tree-item__indent-slot--active {
+		border-color: CanvasText;
+	}
+}
+
+/* The shared hover anchors here instead of to each row's label. */
+.ui-tree-hover-anchor {
+	position: absolute;
+	pointer-events: none;
+	opacity: 0;
+}
diff --git a/packages/ui/src/components/Tree/Tree.stories.tsx b/packages/ui/src/components/Tree/Tree.stories.tsx
new file mode 100644
index 0000000000..b88d203654
--- /dev/null
+++ b/packages/ui/src/components/Tree/Tree.stories.tsx
@@ -0,0 +1,367 @@
+import {
+	expect,
+	fireEvent,
+	screen,
+	userEvent,
+	waitFor,
+	within,
+} from "storybook/test";
+
+import { PIXEL_ALL_THEMES } from "#storybook";
+
+import { TreeDemo } from "../../../storybook/Tree.demo";
+import { IconButton } from "../IconButton/IconButton";
+
+import type { Meta, StoryObj } from "@storybook/react-vite";
+
+import type { CodiconName } from "#codicons";
+
+import type { TreeProps } from "./Tree";
+import type { TreeNode } from "./treeModel";
+
+interface NodeOptions {
+	readonly label?: string;
+	readonly icon?: CodiconName;
+	readonly action?: React.ReactNode;
+	readonly className?: string;
+}
+const node = (id: string, options: NodeOptions = {}): TreeNode => ({
+	id,
+	label: id,
+	...options,
+});
+const branch = (
+	id: string,
+	children: readonly TreeNode[],
+	options: NodeOptions = {},
+): TreeNode => ({ ...node(id, options), children });
+const closeAction = (name: string): React.ReactNode => (
+	<IconButton icon="close" label={`Close ${name}`} />
+);
+
+/** Branch rows have no icons, so explorer aligns leaf icons with twisties. */
+const FILES: readonly TreeNode[] = [
+	branch(
+		"source",
+		[
+			branch("components", [
+				node("tree", {
+					label: "Tree.tsx",
+					icon: "symbol-class",
+					action: closeAction("Tree.tsx"),
+				}),
+				node("styles", { label: "Tree.css", icon: "symbol-color" }),
+			]),
+			node("tests", { icon: "beaker" }),
+		],
+		{ label: "src" },
+	),
+	node("readme", { label: "README.md", icon: "markdown" }),
+];
+
+const tree = (props: TreeProps): React.JSX.Element => (
+	<TreeDemo style={{ width: "280px" }} {...props} />
+);
+const TreeStates = (): React.JSX.Element =>
+	tree({
+		"aria-label": "Explorer",
+		nodes: FILES,
+		selectedItemId: "components",
+		variant: "explorer",
+	});
+const meta: Meta<typeof TreeStates> = {
+	title: "UI/Tree",
+	component: TreeStates,
+	parameters: { pixel: PIXEL_ALL_THEMES },
+};
+export default meta;
+type Story = StoryObj<typeof TreeStates>;
+
+const exerciseTree: NonNullable<Story["play"]> = async ({ canvasElement }) => {
+	// One pointer for the whole play, so the unhover at the end really lands.
+	const user = userEvent.setup();
+	const canvas = within(canvasElement);
+	const selected = canvas.getByRole("treeitem", { name: "components" });
+	const treeItem = canvas.getByRole("treeitem", { name: "Tree.tsx" });
+	await expect(selected).toHaveAttribute("aria-selected", "true");
+	await user.click(
+		canvas.getByRole("button", { name: "Close Tree.tsx", hidden: true }),
+	);
+	await expect(selected).toHaveAttribute("aria-selected", "true");
+	await expect(treeItem).toHaveAttribute("aria-selected", "false");
+	await user.click(treeItem);
+	await expect(treeItem).toHaveAttribute("aria-selected", "true");
+	const readme = canvas.getByRole("treeitem", { name: "README.md" });
+	await user.click(readme);
+	await expect(readme).toHaveAttribute("aria-selected", "true");
+	// Clicking leaves the pointer on the row; these stories snapshot hoverless.
+	await user.unhover(readme);
+};
+
+export const States: Story = { play: exerciseTree };
+export const Stable: Story = {
+	globals: { uiStyle: "stable" },
+	play: exerciseTree,
+};
+
+const ROW_STATES: readonly TreeNode[] = [
+	node("plain", { label: "Plain item", icon: "file" }),
+	branch("selected", [node("child", { label: "Child item" })], {
+		label: "Selected branch",
+		icon: "folder-opened",
+	}),
+	branch("collapsed", [node("hidden", { label: "Hidden item" })], {
+		label: "Collapsed branch",
+		icon: "folder",
+	}),
+	node("action", {
+		label: "Item with action",
+		className: "story-row-action",
+		action: <IconButton icon="trash" label="Delete item" />,
+	}),
+];
+export const RowStates: Story = {
+	parameters: {
+		pseudo: { hover: [".story-row-action > .ui-tree-item__row"] },
+	},
+	render: () =>
+		tree({
+			"aria-label": "Tree row states",
+			nodes: ROW_STATES,
+			selectedItemId: "selected",
+			expandedIds: ["selected"],
+		}),
+};
+export const RowStatesStable: Story = {
+	...RowStates,
+	globals: { uiStyle: "stable" },
+};
+
+/** Two deep branches, so a short scroller always has ancestors to pin. */
+const DEEP_FILES: readonly TreeNode[] = ["alpha", "beta"].map((name) =>
+	branch(name, [
+		branch(
+			`${name}/src`,
+			Array.from({ length: 12 }, (_, index) =>
+				node(`${name}/src/file-${index}`, {
+					label: `file-${index}.ts`,
+					icon: "symbol-class",
+				}),
+			),
+			{ label: "src" },
+		),
+	]),
+);
+
+export const StickyScroll: Story = {
+	render: () => (
+		<div
+			data-testid="scroller"
+			style={{ height: "140px", overflow: "auto", width: "280px" }}
+			ref={(scroller) => {
+				if (scroller) scroller.scrollTop = 143;
+			}}
+		>
+			<TreeDemo
+				aria-label="Sticky explorer"
+				variant="explorer"
+				stickyScroll
+				nodes={DEEP_FILES}
+			/>
+		</div>
+	),
+	play: async ({ canvasElement }) => {
+		await waitFor(() =>
+			expect(
+				canvasElement.querySelector(".ui-tree-sticky__rows"),
+			).not.toBeNull(),
+		);
+		await expect(
+			within(canvasElement).getByTestId("scroller").scrollTop,
+		).toBeGreaterThan(0);
+	},
+};
+
+export const MultiSelect: Story = {
+	render: () =>
+		tree({
+			"aria-label": "Multi-select explorer",
+			nodes: FILES,
+			variant: "explorer",
+			multiSelect: true,
+			selectedItemIds: ["tree", "styles"],
+		}),
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+		const treeElement = canvas.getByRole("tree");
+		const readme = canvas.getByRole("treeitem", { name: "README.md" });
+		await fireEvent.click(readme, { ctrlKey: true });
+		await expect(readme).toHaveAttribute("aria-selected", "true");
+		await expect(
+			canvas.getByRole("treeitem", { name: "Tree.tsx" }),
+		).toHaveAttribute("aria-selected", "true");
+		await expect(canvasElement.ownerDocument.activeElement).toBe(treeElement);
+		await expect(treeElement).toHaveAttribute(
+			"aria-activedescendant",
+			readme.id,
+		);
+	},
+};
+
+export const Focused: Story = {
+	render: () =>
+		tree({
+			"aria-label": "Focused explorer",
+			nodes: FILES,
+			selectedItemId: "tree",
+			variant: "explorer",
+		}),
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+		const treeElement = canvas.getByRole("tree");
+		const styles = canvas.getByRole("treeitem", { name: "Tree.css" });
+		treeElement.focus();
+		await waitFor(() => expect(treeElement).toHaveClass("ui-tree--focused"));
+		await fireEvent.keyDown(treeElement, { key: "ArrowDown" });
+		await expect(canvasElement.ownerDocument.activeElement).toBe(treeElement);
+		await expect(treeElement).toHaveAttribute(
+			"aria-activedescendant",
+			styles.id,
+		);
+		await expect(styles).toHaveAttribute("aria-selected", "false");
+	},
+};
+
+const NESTED_FILES: readonly TreeNode[] = [
+	branch("src", [
+		branch("components", [
+			branch("Tree", [
+				node("Tree.tsx", {
+					icon: "symbol-class",
+					className: "story-hover",
+					action: closeAction("Tree.tsx"),
+				}),
+				node("TreeRow.tsx", { icon: "symbol-class" }),
+				node("useTreeAdapter.ts", { icon: "symbol-method" }),
+				branch("sticky", [node("StickyScroll.tsx", { icon: "symbol-class" })]),
+			]),
+		]),
+	]),
+	node("README.md", { icon: "markdown" }),
+];
+export const Nested: Story = {
+	render: () =>
+		tree({
+			"aria-label": "Nested explorer",
+			nodes: NESTED_FILES,
+			selectedItemId: "StickyScroll.tsx",
+			variant: "explorer",
+		}),
+	parameters: {
+		pseudo: { hover: [".ui-tree", ".story-hover > .ui-tree-item__row"] },
+	},
+	play: async ({ canvasElement }) => {
+		const deepLeaf = within(canvasElement).getByRole("treeitem", {
+			name: "StickyScroll.tsx",
+		});
+		await expect(deepLeaf).toHaveAttribute("aria-level", "5");
+		await userEvent.click(deepLeaf);
+		await expect(deepLeaf).toHaveAttribute("aria-selected", "true");
+	},
+};
+
+const LONG_NAME = "a-really-long-component-name-that-truncates.tsx";
+const HOVER_FILES: readonly TreeNode[] = [
+	branch(
+		"hover-src",
+		[
+			node("hover-index", { label: "index.ts", icon: "symbol-method" }),
+			node("hover-long", { label: LONG_NAME, icon: "symbol-class" }),
+			node("hover-actions", {
+				label: "Workspace",
+				icon: "vm",
+				action: (
+					<>
+						<IconButton icon="play" label="Start workspace" />
+						<IconButton icon="gear" label="Workspace settings" />
+					</>
+				),
+			}),
+		],
+		{ label: "src" },
+	),
+];
+
+/** Leaves room above the rows, where a hover sits. */
+const hoverTree = (ariaLabel: string, selectedItemId?: string) => (
+	<div style={{ paddingTop: "40px" }}>
+		{tree({
+			"aria-label": ariaLabel,
+			nodes: HOVER_FILES,
+			selectedItemId,
+		})}
+	</div>
+);
+
+/** The bubble takes its x from the cursor, so give the pointer a real one. */
+const hoverAt = async (element: Element): Promise<void> => {
+	// An action bar is revealed by CSS, which lands a frame after the render.
+	await waitFor(() =>
+		expect(element.getBoundingClientRect().width).toBeGreaterThan(0),
+	);
+	const bounds = element.getBoundingClientRect();
+	await userEvent.hover(element);
+	await fireEvent.pointerMove(element, {
+		clientX: bounds.left + 24,
+		clientY: bounds.top + bounds.height / 2,
+	});
+};
+
+/** The bubble is portalled, so it lands outside the story canvas. */
+const expectBubble = async (content: string): Promise<void> => {
+	const bubble = await screen.findByRole("tooltip");
+	await waitFor(() => expect(bubble).toHaveTextContent(content));
+};
+
+export const Hover: Story = {
+	render: () => hoverTree("Hovered label"),
+	play: async ({ canvasElement }) => {
+		const hovered = within(canvasElement).getByRole("treeitem", {
+			name: LONG_NAME,
+		});
+		await hoverAt(hovered.getElementsByClassName("ui-tree-item__content")[0]);
+		await expectBubble(LONG_NAME);
+	},
+};
+
+export const HoverOnAction: Story = {
+	// Selected so CSS reveals the action bar, which a synthetic hover cannot.
+	render: () => hoverTree("Hovered action", "hover-actions"),
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+		await hoverAt(
+			canvas.getByRole("button", { name: "Start workspace", hidden: true }),
+		);
+		await expectBubble("Start workspace");
+		// Crossing the same action bar swaps the bubble without a second delay.
+		await hoverAt(
+			canvas.getByRole("button", { name: "Workspace settings", hidden: true }),
+		);
+		await expectBubble("Workspace settings");
+	},
+};
+
+export const HoverByKeyboard: Story = {
+	render: () => hoverTree("Keyboard hover"),
+	play: async ({ canvasElement }) => {
+		const treeElement = within(canvasElement).getByRole("tree");
+		treeElement.focus();
+		await waitFor(() => expect(treeElement).toHaveClass("ui-tree--focused"));
+		await fireEvent.keyDown(treeElement, { key: "ArrowDown" });
+		await fireEvent.keyDown(treeElement, { key: "ArrowDown" });
+		// VS Code binds list.showHover to this chord.
+		await fireEvent.keyDown(treeElement, { key: "k", ctrlKey: true });
+		await fireEvent.keyDown(treeElement, { key: "i", ctrlKey: true });
+		await expectBubble(LONG_NAME);
+	},
+};
diff --git a/packages/ui/src/components/Tree/Tree.tsx b/packages/ui/src/components/Tree/Tree.tsx
new file mode 100644
index 0000000000..eef0bc6cbe
--- /dev/null
+++ b/packages/ui/src/components/Tree/Tree.tsx
@@ -0,0 +1,150 @@
+import { type ComponentPropsWithRef, useId, useRef } from "react";
+
+import { cx } from "#cx";
+import { setForwardedRef } from "#ref";
+
+import { TooltipScope } from "../Tooltip/Tooltip";
+
+import { StickyScroll } from "./sticky/StickyScroll";
+import "./Tree.css";
+import { TreeHover, type TreeHoverControl } from "./TreeHover";
+import { TreeRow } from "./TreeRow";
+import { useTreeAdapter, type SelectionProps } from "./useTreeAdapter";
+
+import type { TreeNode } from "./treeModel";
+import type { TreeExpandMode, TreeMultiSelectModifier } from "./treePolicy";
+
+/** VS Code's `workbench.tree.stickyScrollMaxItemCount` default. */
+const DEFAULT_STICKY_COUNT = 7;
+const NO_IDS: readonly string[] = [];
+
+/** The tree's own props; everything else lands on the container element. */
+interface TreeOwnProps {
+	readonly nodes: readonly TreeNode[];
+	readonly expandedIds?: readonly string[];
+	readonly onExpandedIdsChange?: (expandedIds: readonly string[]) => void;
+	/** `explorer` aligns leaf icons with branch twisties, as VS Code does. */
+	readonly variant?: "default" | "explorer";
+	readonly expandMode?: TreeExpandMode;
+	readonly multiSelectModifier?: TreeMultiSelectModifier;
+	/** Pins ancestors while scrolling; a number caps how many. */
+	readonly stickyScroll?: boolean | number;
+}
+
+type TreeContainerProps = Omit<
+	ComponentPropsWithRef<"div">,
+	"role" | "onSelect" | "children" | keyof TreeOwnProps
+>;
+
+export type TreeProps = TreeOwnProps & SelectionProps & TreeContainerProps;
+
+/** Whether the focus or blur target is inside the tree rather than a portal. */
+function ownsTarget(tree: HTMLElement, target: EventTarget | null): boolean {
+	return target instanceof Node && tree.contains(target);
+}
+
+/** A controlled tree following the current VS Code workbench behavior. */
+export function Tree({
+	nodes,
+	expandedIds = NO_IDS,
+	onExpandedIdsChange,
+	multiSelect,
+	selectedItemId,
+	onSelectedItemChange,
+	selectedItemIds,
+	onSelectedItemsChange,
+	variant = "default",
+	expandMode = "singleClick",
+	multiSelectModifier = "ctrlCmd",
+	stickyScroll = false,
+	className,
+	onFocus,
+	onBlur,
+	onKeyDown,
+	ref,
+	...containerProps
+}: TreeProps): React.JSX.Element {
+	const treeRef = useRef<HTMLDivElement>(null);
+	const hoverRef: TreeHoverControl = useRef(undefined);
+	const treeDomId = useId();
+	const selection: SelectionProps = multiSelect
+		? { multiSelect: true, selectedItemIds, onSelectedItemsChange }
+		: { multiSelect: false, selectedItemId, onSelectedItemChange };
+	const adapter = useTreeAdapter({
+		...selection,
+		nodes,
+		expandedIds,
+		onExpandedIdsChange,
+		expandMode,
+		multiSelectModifier,
+		onKeyDown,
+		treeRef,
+		hoverControl: hoverRef,
+	});
+
+	return (
+		<TooltipScope>
+			<div
+				{...containerProps}
+				ref={(element) => {
+					treeRef.current = element;
+					setForwardedRef(ref, element);
+				}}
+				role="tree"
+				tabIndex={0}
+				aria-activedescendant={
+					adapter.focusedId ? `${treeDomId}-${adapter.focusedId}` : undefined
+				}
+				aria-multiselectable={multiSelect ? true : undefined}
+				className={cx(
+					"ui-tree",
+					variant === "explorer" && "ui-tree--explorer",
+					adapter.hasDomFocus && "ui-tree--focused",
+					className,
+				)}
+				onFocus={(event) => {
+					onFocus?.(event);
+					if (
+						!event.defaultPrevented &&
+						ownsTarget(event.currentTarget, event.target)
+					) {
+						adapter.onFocusIn(event.target);
+					}
+				}}
+				onBlur={(event) => {
+					onBlur?.(event);
+					if (
+						!event.defaultPrevented &&
+						!ownsTarget(event.currentTarget, event.relatedTarget)
+					) {
+						adapter.onBlurOut();
+					}
+				}}
+				onClick={adapter.onClick}
+				onKeyDown={adapter.onKeyDown}
+			>
+				<TreeHover treeRef={treeRef} controlRef={hoverRef}>
+					{stickyScroll ? (
+						<StickyScroll
+							maxCount={
+								stickyScroll === true ? DEFAULT_STICKY_COUNT : stickyScroll
+							}
+							adapter={adapter}
+							treeRef={treeRef}
+						/>
+					) : null}
+					{adapter.model.visibleRows.map((row) => (
+						<TreeRow
+							key={row.node.id}
+							id={`${treeDomId}-${row.node.id}`}
+							row={row}
+							focused={row.node.id === adapter.focusedId}
+							selected={adapter.selectedIds.has(row.node.id)}
+							guideFlags={adapter.guideFlags(row)}
+						/>
+					))}
+				</TreeHover>
+			</div>
+		</TooltipScope>
+	);
+}
diff --git a/packages/ui/src/components/Tree/TreeHover.tsx b/packages/ui/src/components/Tree/TreeHover.tsx
new file mode 100644
index 0000000000..7e58e75ace
--- /dev/null
+++ b/packages/ui/src/components/Tree/TreeHover.tsx
@@ -0,0 +1,176 @@
+import {
+	useEffect,
+	useImperativeHandle,
+	useRef,
+	useState,
+	type ReactNode,
+	type RefObject,
+} from "react";
+
+import {
+	HoverDelegateScope,
+	Tooltip,
+	useTooltipDelay,
+	type HoverDelegate,
+	type HoverTarget,
+} from "../Tooltip/Tooltip";
+
+const GRACE_MS = 100;
+
+/** Native reopens with no delay this soon after hiding, and only for a dense
+    cluster of targets such as an action bar. */
+const INSTANT_MS = 200;
+const DENSE_CLUSTER = ".ui-tree-item__action";
+
+/** setupCustomHover offsets a cursor-placed hover by this much. */
+const CURSOR_OFFSET_PX = 10;
+
+const ROW = ".ui-tree-item";
+
+export type TreeHoverControl = RefObject<HoverDelegate | undefined>;
+
+interface Shown extends HoverTarget {
+	readonly top: number;
+	readonly left: number;
+	readonly width: number;
+	readonly height: number;
+	readonly align: "center" | "start";
+}
+
+/**
+ * One hover for the whole tree, like the native list's shared widget: rows and
+ * anything inside them report the element under the pointer, and an invisible
+ * anchor moves to it.
+ */
+export function TreeHover({
+	children,
+	treeRef,
+	controlRef,
+}: {
+	children: ReactNode;
+	treeRef: RefObject<HTMLDivElement | null>;
+	controlRef: TreeHoverControl;
+}): React.JSX.Element {
+	const delay = useTooltipDelay();
+	const [shown, setShown] = useState<Shown>();
+	const openRef = useRef(false);
+	const hiddenAtRef = useRef(0);
+	const clusterRef = useRef<Element | null>(null);
+	const pointerXRef = useRef<number | undefined>(undefined);
+	const timerRef = useRef<ReturnType<typeof setTimeout>>(undefined);
+
+	const hide = (): void => {
+		clearTimeout(timerRef.current);
+		if (openRef.current) hiddenAtRef.current = Date.now();
+		openRef.current = false;
+		setShown(undefined);
+	};
+
+	// Native centers on an action bar button and follows the cursor along a row,
+	// measuring the row so taller content cannot push the bubble off it.
+	const show = (target: HoverTarget, atPointer = true): void => {
+		const tree = treeRef.current;
+		const targetRect = target.element.getBoundingClientRect();
+		if (
+			!tree?.contains(target.element) ||
+			targetRect.width <= 0 ||
+			targetRect.height <= 0
+		) {
+			hide();
+			return;
+		}
+		const cluster = target.element.closest(DENSE_CLUSTER);
+		const box = cluster
+			? target.element
+			: (target.element.closest(ROW) ?? target.element);
+		const bounds = tree.getBoundingClientRect();
+		const rect = cluster ? targetRect : box.getBoundingClientRect();
+		const cursorX = cluster || !atPointer ? undefined : pointerXRef.current;
+		openRef.current = true;
+		clusterRef.current = cluster;
+		setShown({
+			...target,
+			top: rect.top - bounds.top,
+			left:
+				(cursorX === undefined ? rect.left : cursorX + CURSOR_OFFSET_PX) -
+				bounds.left,
+			width: cursorX === undefined ? rect.width : 0,
+			height: rect.height,
+			align: cursorX === undefined ? "center" : "start",
+		});
+	};
+
+	const setTarget: HoverDelegate = (target, immediate = false) => {
+		clearTimeout(timerRef.current);
+		if (!target?.content) {
+			if (immediate) {
+				hide();
+				return;
+			}
+			timerRef.current = setTimeout(hide, GRACE_MS);
+			return;
+		}
+		const cluster = target.element.closest(DENSE_CLUSTER);
+		const recent =
+			openRef.current || Date.now() - hiddenAtRef.current < INSTANT_MS;
+		if (immediate || (recent && cluster && cluster === clusterRef.current)) {
+			show(target, !immediate);
+			return;
+		}
+		hide();
+		timerRef.current = setTimeout(() => show(target), delay);
+	};
+
+	useImperativeHandle(controlRef, () => setTarget, [setTarget]);
+	useEffect(() => () => clearTimeout(timerRef.current), []);
+
+	useEffect(() => {
+		const tree = treeRef.current;
+		if (!tree) return;
+		const track = (event: PointerEvent): void => {
+			pointerXRef.current = event.clientX;
+		};
+		tree.addEventListener("pointermove", track, { passive: true });
+		return () => tree.removeEventListener("pointermove", track);
+	}, [treeRef]);
+
+	useEffect(() => {
+		const tree = treeRef.current;
+		if (!tree) return;
+		// Capture also dismisses hovers when an action stops propagation.
+		tree.addEventListener("pointerdown", hide, true);
+		return () => tree.removeEventListener("pointerdown", hide, true);
+	}, [treeRef, hide]);
+
+	return (
+		<HoverDelegateScope delegate={setTarget}>
+			{children}
+			{/* Outside the scope, or the bubble would delegate to itself. */}
+			<HoverDelegateScope delegate={undefined}>
+				{shown ? (
+					<Tooltip
+						content={shown.content}
+						align={shown.align}
+						open
+						onOpenChange={(open) => {
+							if (!open) hide();
+						}}
+						onPointerEnter={() => clearTimeout(timerRef.current)}
+						onPointerLeave={() => setTarget(undefined)}
+					>
+						<span
+							aria-hidden="true"
+							className="ui-tree-hover-anchor"
+							style={{
+								top: shown.top,
+								left: shown.left,
+								width: shown.width,
+								height: shown.height,
+							}}
+						/>
+					</Tooltip>
+				) : null}
+			</HoverDelegateScope>
+		</HoverDelegateScope>
+	);
+}
diff --git a/packages/ui/src/components/Tree/TreeRow.tsx b/packages/ui/src/components/Tree/TreeRow.tsx
new file mode 100644
index 0000000000..0b4832cada
--- /dev/null
+++ b/packages/ui/src/components/Tree/TreeRow.tsx
@@ -0,0 +1,86 @@
+import { type CSSProperties, memo } from "react";
+
+import { cx } from "#cx";
+
+import { Icon } from "../Icon/Icon";
+import { Tooltip } from "../Tooltip/Tooltip";
+
+import { rowTooltip, type TreeRowModel } from "./treeModel";
+
+interface TreeRowProps {
+	readonly row: TreeRowModel;
+	/** Left out by rows rendered outside the tree, which only present. */
+	readonly id?: string;
+	readonly focused?: boolean;
+	readonly selected?: boolean;
+	/** One character per ancestor, `1` where the indent guide is active. */
+	readonly guideFlags?: string;
+	/** Positions a pinned copy inside the sticky widget. */
+	readonly style?: CSSProperties;
+}
+
+/** Pure presentation: props compare by value, so `memo` skips untouched rows. */
+export const TreeRow = memo(function TreeRow({
+	row,
+	id,
+	focused = false,
+	selected = false,
+	guideFlags = "",
+	style,
+}: TreeRowProps): React.JSX.Element {
+	const { node, expanded } = row;
+	const level = row.pathIds.length + 1;
+	const tooltip = rowTooltip(row);
+	// Native hangs the hover off the label, not the whole row.
+	const label = (
+		<span className="ui-tree-item__content">
+			{node.icon ? <Icon name={node.icon} /> : null}
+			{typeof node.label === "string" ? <span>{node.label}</span> : node.label}
+		</span>
+	);
+	return (
+		<div
+			id={id}
+			data-tree-id={id ? node.id : undefined}
+			role="treeitem"
+			aria-label={row.textValue === "" ? undefined : row.textValue}
+			aria-level={level}
+			aria-posinset={row.posInSet}
+			aria-setsize={row.setSize}
+			aria-selected={selected}
+			aria-expanded={expanded}
+			tabIndex={-1}
+			className={cx(
+				"ui-tree-item",
+				focused && "ui-tree-item--focused",
+				node.className,
+			)}
+			style={{ ...style, "--ui-tree-level": level } as CSSProperties}
+		>
+			<div className="ui-tree-item__row">
+				<span className="ui-tree-item__indent" aria-hidden="true">
+					{row.pathIds.map((pathId, depth) => (
+						<span
+							key={pathId}
+							className={cx(
+								"ui-tree-item__indent-slot",
+								guideFlags[depth] === "1" &&
+									"ui-tree-item__indent-slot--active",
+							)}
+						/>
+					))}
+				</span>
+				<span className="ui-tree-item__chevron" aria-hidden="true">
+					{expanded === undefined ? null : (
+						<Icon name={expanded ? "chevron-down" : "chevron-right"} />
+					)}
+				</span>
+				{tooltip ? <Tooltip content={tooltip}>{label}</Tooltip> : label}
+				{/* Native keeps a row's actions live on plain hover; CSS reveals them. */}
+				{node.action ? (
+					<span className="ui-tree-item__action">{node.action}</span>
+				) : null}
+			</div>
+		</div>
+	);
+});
diff --git a/packages/ui/src/components/Tree/rowDom.ts b/packages/ui/src/components/Tree/rowDom.ts
new file mode 100644
index 0000000000..3b101c68fc
--- /dev/null
+++ b/packages/ui/src/components/Tree/rowDom.ts
@@ -0,0 +1,66 @@
+/** The DOM reads the data model cannot answer: what an event actually hit. */
+
+/**
+ * Anything focusable in a row owns its own clicks and keys. `[tabindex]` covers
+ * the interactive ARIA roles: a role nothing can focus is one nothing can use.
+ */
+const FOCUSABLE_SELECTOR = [
+	"a[href]",
+	"button",
+	"input",
+	"select",
+	"textarea",
+	"[contenteditable]:not([contenteditable='false'])",
+	"[tabindex]:not([tabindex='-1'])",
+].join(",");
+
+/** The focusable element the event hit, unless that element is `container`. */
+export function nestedInteractiveTarget(
+	target: EventTarget | null,
+	container: HTMLElement,
+): Element | null {
+	if (!(target instanceof Element) || target === container) {
+		return null;
+	}
+	const focusable = target.closest(FOCUSABLE_SELECTOR);
+	return focusable !== null &&
+		focusable !== container &&
+		container.contains(focusable)
+		? focusable
+		: null;
+}
+
+/** Whether a click landed on the twistie rather than the row body. */
+export function hitTwistie(
+	row: { readonly expanded: boolean | undefined },
+	target: EventTarget | null,
+): boolean {
+	return (
+		row.expanded !== undefined &&
+		target instanceof Element &&
+		target.closest(".ui-tree-item__chevron") !== null
+	);
+}
+
+/** The row element the event hit, if any. */
+export function closestRow(target: EventTarget | null): HTMLElement | null {
+	return target instanceof Element
+		? target.closest<HTMLElement>("[data-tree-id]")
+		: null;
+}
+
+export function scrollableAncestor(
+	element: HTMLElement,
+): HTMLElement | undefined {
+	for (
+		let parent = element.parentElement;
+		parent !== null;
+		parent = parent.parentElement
+	) {
+		const { overflowY } = getComputedStyle(parent);
+		if (overflowY === "auto" || overflowY === "scroll") {
+			return parent;
+		}
+	}
+	return undefined;
+}
diff --git a/packages/ui/src/components/Tree/sticky/StickyScroll.tsx b/packages/ui/src/components/Tree/sticky/StickyScroll.tsx
new file mode 100644
index 0000000000..05490aba2e
--- /dev/null
+++ b/packages/ui/src/components/Tree/sticky/StickyScroll.tsx
@@ -0,0 +1,205 @@
+import {
+	type RefObject,
+	useEffect,
+	useRef,
+	useState,
+	useSyncExternalStore,
+} from "react";
+
+import { hitTwistie, scrollableAncestor } from "../rowDom";
+import { ROW_HEIGHT_PX, type TreeRowModel } from "../treeModel";
+import { TreeRow } from "../TreeRow";
+
+import { computeStickyState, NO_STICKY, type StickyState } from "./stickyState";
+
+import type { TreeAdapter } from "../useTreeAdapter";
+
+function useStickyState(
+	rows: readonly TreeRowModel[],
+	maxCount: number,
+	widgetRef: RefObject<HTMLDivElement | null>,
+): StickyState {
+	const snapshotRef = useRef(NO_STICKY);
+	const subscribe = (notify: () => void): (() => void) => {
+		const tree = widgetRef.current?.parentElement;
+		const scroller = tree ? scrollableAncestor(tree) : undefined;
+		if (!scroller) return () => undefined;
+		scroller.addEventListener("scroll", notify, { passive: true });
+		const observer =
+			typeof ResizeObserver === "undefined"
+				? undefined
+				: new ResizeObserver(notify);
+		observer?.observe(scroller);
+		return () => {
+			scroller.removeEventListener("scroll", notify);
+			observer?.disconnect();
+		};
+	};
+	const getSnapshot = (): StickyState => {
+		const widget = widgetRef.current;
+		const tree = widget?.parentElement;
+		if (!widget || !tree) return NO_STICKY;
+		const next = computeStickyState(
+			rows,
+			widget.getBoundingClientRect().top - tree.getBoundingClientRect().top,
+			scrollableAncestor(tree)?.clientHeight ?? 0,
+			maxCount,
+		);
+		const current = snapshotRef.current;
+		if (
+			current.pushOffset !== next.pushOffset ||
+			current.ids.length !== next.ids.length ||
+			current.ids.some((id, index) => id !== next.ids[index])
+		)
+			snapshotRef.current = next;
+		return snapshotRef.current;
+	};
+	return useSyncExternalStore(subscribe, getSnapshot, () => NO_STICKY);
+}
+
+export function StickyScroll({
+	maxCount,
+	adapter,
+	treeRef,
+}: {
+	maxCount: number;
+	adapter: TreeAdapter;
+	treeRef: React.RefObject<HTMLDivElement | null>;
+}): React.JSX.Element {
+	const { visibleRows, rowsById } = adapter.model;
+	const widgetRef = useRef<HTMLDivElement>(null);
+	const state = useStickyState(visibleRows, maxCount, widgetRef);
+	const pinnedRows = state.ids
+		.map((id) => rowsById.get(id))
+		.filter((row) => row !== undefined);
+	const pinnedHeight = pinnedRows.length * ROW_HEIGHT_PX + state.pushOffset;
+	const [requestedIndex, setRequestedIndex] = useState(0);
+	const focusedIndex = Math.max(
+		0,
+		Math.min(requestedIndex, pinnedRows.length - 1),
+	);
+
+	useEffect(() => {
+		if (
+			pinnedRows.length === 0 &&
+			widgetRef.current?.contains(document.activeElement)
+		) {
+			treeRef.current?.focus();
+		}
+	}, [pinnedRows.length, treeRef]);
+
+	const reveal = (row: TreeRowModel, index: number): void => {
+		const widget = widgetRef.current;
+		const tree = widget?.parentElement;
+		if (!widget || !tree) return;
+		scrollableAncestor(tree)?.scrollBy(
+			0,
+			visibleRows.indexOf(row) * ROW_HEIGHT_PX -
+				index * ROW_HEIGHT_PX -
+				(widget.getBoundingClientRect().top - tree.getBoundingClientRect().top),
+		);
+	};
+	const revealAndDispatch = (
+		row: TreeRowModel,
+		commands: Parameters<TreeAdapter["dispatch"]>[0],
+	): void => {
+		reveal(row, focusedIndex);
+		adapter.dispatch(commands);
+	};
+
+	return (
+		<div
+			className="ui-tree-sticky"
+			ref={widgetRef}
+			tabIndex={pinnedRows.length > 0 ? 0 : -1}
+			onFocus={(event) => {
+				if (event.target === event.currentTarget)
+					setRequestedIndex(focusedIndex);
+			}}
+			onKeyDown={(event) => {
+				const row = pinnedRows[focusedIndex];
+				if (!row) return;
+				if (event.key === "ArrowUp")
+					setRequestedIndex(Math.max(0, focusedIndex - 1));
+				else if (event.key === "ArrowDown" || event.key === "ArrowRight") {
+					if (pinnedRows[focusedIndex + 1]) setRequestedIndex(focusedIndex + 1);
+					else {
+						const child = visibleRows[visibleRows.indexOf(row) + 1];
+						if (child?.pathIds.includes(row.node.id)) {
+							adapter.dispatch([{ type: "focus", id: child.node.id }]);
+						}
+					}
+				} else if (event.key === "Enter") {
+					revealAndDispatch(row, [
+						{ type: "focus", id: row.node.id },
+						{
+							type: "select",
+							id: row.node.id,
+							toggle: false,
+							range: false,
+							preserveHidden: true,
+						},
+					]);
+				} else if (event.key === "ArrowLeft") {
+					revealAndDispatch(row, [
+						{ type: "focus", id: row.node.id },
+						...(row.expanded
+							? [
+									{
+										type: "toggle" as const,
+										id: row.node.id,
+										recursive: false,
+									},
+								]
+							: []),
+					]);
+				} else if (event.key === " ") {
+					revealAndDispatch(row, [{ type: "focus", id: row.node.id }]);
+				} else return;
+				event.preventDefault();
+				event.stopPropagation();
+			}}
+		>
+			{pinnedRows.length > 0 ? (
+				<>
+					<div
+						className="ui-tree-sticky__rows"
+						style={{ height: pinnedHeight }}
+						onClick={(event) => {
+							const index = [...event.currentTarget.children].findIndex(
+								(child) => child.contains(event.target as Node),
+							);
+							const row = pinnedRows[index];
+							if (!row) return;
+							if (!adapter.isSelectionGesture(event)) reveal(row, index);
+							adapter.onPointer(
+								row,
+								event,
+								hitTwistie(row, event.target),
+								"sticky",
+							);
+						}}
+					>
+						{pinnedRows.map((row, index) => (
+							<TreeRow
+								key={row.node.id}
+								row={row}
+								focused={index === focusedIndex}
+								style={{
+									top:
+										index * ROW_HEIGHT_PX +
+										(index === pinnedRows.length - 1 ? state.pushOffset : 0),
+									zIndex: pinnedRows.length - index,
+								}}
+							/>
+						))}
+					</div>
+					<div
+						className="ui-tree-sticky__shadow"
+						style={{ top: pinnedHeight }}
+					/>
+				</>
+			) : null}
+		</div>
+	);
+}
diff --git a/packages/ui/src/components/Tree/sticky/stickyState.ts b/packages/ui/src/components/Tree/sticky/stickyState.ts
new file mode 100644
index 0000000000..a180208547
--- /dev/null
+++ b/packages/ui/src/components/Tree/sticky/stickyState.ts
@@ -0,0 +1,72 @@
+import { ROW_HEIGHT_PX, type TreeRowModel } from "../treeModel";
+
+/** VS Code caps the sticky widget at 40% of the viewport. */
+const MAX_VIEWPORT_RATIO = 0.4;
+
+export interface StickyState {
+	/** Ids of the pinned ancestor chain, outermost first. */
+	readonly ids: readonly string[];
+	/** Upward shift in px while the last pinned subtree scrolls out. */
+	readonly pushOffset: number;
+}
+
+export const NO_STICKY: StickyState = { ids: [], pushOffset: 0 };
+
+/**
+ * The ancestor chain to pin, like VS Code's findStickyState: the ancestors
+ * of the topmost row not covered by the widget, capped by `maxCount` and by
+ * viewport share. Pinned rows cover rows below, which can deepen the chain,
+ * so grow to a fixpoint.
+ */
+export function computeStickyState(
+	rows: readonly TreeRowModel[],
+	scrolledPx: number,
+	viewportPx: number,
+	maxCount: number,
+): StickyState {
+	const cap = Math.min(
+		maxCount,
+		Math.floor((viewportPx * MAX_VIEWPORT_RATIO) / ROW_HEIGHT_PX),
+	);
+	if (scrolledPx <= 0 || cap <= 0) {
+		return NO_STICKY;
+	}
+	const topIndex = Math.floor(scrolledPx / ROW_HEIGHT_PX);
+	let count = 0;
+	let chain: readonly string[] = [];
+	for (;;) {
+		const rowChain = rows[topIndex + count]?.pathIds ?? [];
+		const next = Math.min(rowChain.length, cap);
+		if (next <= count) {
+			break;
+		}
+		count = next;
+		chain = rowChain;
+	}
+	const ids = chain.slice(0, count);
+	if (ids.length === 0) {
+		return NO_STICKY;
+	}
+	return { ids, pushOffset: pushOffset(rows, scrolledPx, ids) };
+}
+
+/** How far the widget shifts up as the last pinned subtree ends. */
+function pushOffset(
+	rows: readonly TreeRowModel[],
+	scrolledPx: number,
+	ids: readonly string[],
+): number {
+	const lastId = ids.at(-1);
+	let endIndex = -1;
+	rows.forEach((row, index) => {
+		if (row.node.id === lastId || row.pathIds.includes(lastId ?? "")) {
+			endIndex = index;
+		}
+	});
+	if (endIndex === -1) {
+		return 0;
+	}
+	const subtreeBottom = (endIndex + 1) * ROW_HEIGHT_PX;
+	const widgetBottom = scrolledPx + ids.length * ROW_HEIGHT_PX;
+	return Math.min(0, subtreeBottom - widgetBottom);
+}
diff --git a/packages/ui/src/components/Tree/treeModel.ts b/packages/ui/src/components/Tree/treeModel.ts
new file mode 100644
index 0000000000..9850ab3094
--- /dev/null
+++ b/packages/ui/src/components/Tree/treeModel.ts
@@ -0,0 +1,105 @@
+import type { ReactNode } from "react";
+
+import type { CodiconName } from "#codicons";
+
+/** VS Code's tree row height; Tree.css --ui-tree-row-height must match. */
+export const ROW_HEIGHT_PX = 22;
+
+/** A string label doubles as the text value; a rich label must supply one. */
+type TreeNodeLabel =
+	| { readonly label: string; readonly textValue?: string }
+	| { readonly label: ReactNode; readonly textValue: string };
+
+/** One node of tree data. `children` marks a branch, `[]` one still loading. */
+export type TreeNode = TreeNodeLabel & {
+	readonly id: string;
+	readonly icon?: CodiconName;
+	/** Hover content; defaults to the text value, `null` opts out. */
+	readonly tooltip?: ReactNode;
+	readonly action?: ReactNode;
+	readonly className?: string;
+	readonly children?: readonly TreeNode[];
+};
+
+export interface TreeRowModel {
+	readonly node: TreeNode;
+	/** Ancestor ids, outermost first; the ARIA level is one past its length. */
+	readonly pathIds: readonly string[];
+	/** Flat rows have no group element, so each declares its own set. */
+	readonly posInSet: number;
+	readonly setSize: number;
+	readonly textValue: string;
+	/** undefined on leaves. */
+	readonly expanded: boolean | undefined;
+}
+
+export interface TreeModel {
+	/** Rows under expanded ancestors only, in render order. */
+	readonly visibleRows: readonly TreeRowModel[];
+	/** Every row, hidden ones included. */
+	readonly rows: readonly TreeRowModel[];
+	readonly rowsById: ReadonlyMap<string, TreeRowModel>;
+	readonly visibleIds: ReadonlySet<string>;
+}
+
+/** The row's hover content; empty when the node opts out. */
+export function rowTooltip(row: TreeRowModel): ReactNode {
+	const { tooltip } = row.node;
+	return tooltip === undefined ? row.textValue : tooltip;
+}
+
+export function parentId(row: TreeRowModel): string | undefined {
+	return row.pathIds.at(-1);
+}
+
+/** Ids are unique tree wide, as in VS Code, so a duplicate throws. */
+export function createTreeModel(
+	nodes: readonly TreeNode[],
+	expandedIds: ReadonlySet<string>,
+): TreeModel {
+	const visibleRows: TreeRowModel[] = [];
+	const rows: TreeRowModel[] = [];
+	const rowsById = new Map<string, TreeRowModel>();
+
+	const visit = (
+		siblings: readonly TreeNode[],
+		pathIds: readonly string[],
+		visible: boolean,
+	): void => {
+		siblings.forEach((node, index) => {
+			if (rowsById.has(node.id)) {
+				throw new Error(`Tree node id "${node.id}" must be unique.`);
+			}
+			const expanded = node.children ? expandedIds.has(node.id) : undefined;
+			const row: TreeRowModel = {
+				node,
+				pathIds,
+				posInSet: index + 1,
+				setSize: siblings.length,
+				textValue:
+					node.textValue ?? (typeof node.label === "string" ? node.label : ""),
+				expanded,
+			};
+			rows.push(row);
+			rowsById.set(node.id, row);
+			if (visible) {
+				visibleRows.push(row);
+			}
+			if (node.children) {
+				visit(
+					node.children,
+					[...pathIds, node.id],
+					visible && expanded === true,
+				);
+			}
+		});
+	};
+
+	visit(nodes, [], true);
+	return {
+		visibleRows,
+		rows,
+		rowsById,
+		visibleIds: new Set(visibleRows.map((row) => row.node.id)),
+	};
+}
diff --git a/packages/ui/src/components/Tree/treePolicy.ts b/packages/ui/src/components/Tree/treePolicy.ts
new file mode 100644
index 0000000000..1bd7d55fcb
--- /dev/null
+++ b/packages/ui/src/components/Tree/treePolicy.ts
@@ -0,0 +1,299 @@
+/**
+ * The VS Code key and pointer bindings, as the commands a gesture means for a
+ * row. "Policy" because it decides intent only: `treeTransition.ts` applies it.
+ */
+
+import { parentId, type TreeRowModel } from "./treeModel";
+
+/** Mirrors `workbench.tree.expandMode`, values included. */
+export type TreeExpandMode = "singleClick" | "doubleClick";
+
+/** Mirrors `workbench.list.multiSelectModifier`, values included. */
+export type TreeMultiSelectModifier = "ctrlCmd" | "alt";
+
+export interface TreeCommandBehavior {
+	readonly expandMode: TreeExpandMode;
+	readonly multiSelect: boolean;
+	readonly multiSelectModifier: TreeMultiSelectModifier;
+}
+
+/** The modifier keys a gesture carries, as a DOM event reports them. */
+export interface TreeModifiers {
+	readonly ctrlKey: boolean;
+	readonly metaKey: boolean;
+	readonly altKey: boolean;
+	readonly shiftKey: boolean;
+}
+
+interface SelectOptions {
+	/** Adds to or removes from the selection instead of replacing it. */
+	readonly toggle: boolean;
+	/** Selects from the anchor through this row. */
+	readonly range: boolean;
+	/** Whether selected rows hidden under a collapsed branch survive. */
+	readonly preserveHidden: boolean;
+}
+
+type RowCommand<Type extends string, Options = object> = {
+	readonly type: Type;
+	readonly id: string;
+} & Options;
+
+export type TreeCommand =
+	| RowCommand<"focus">
+	/** Selects the row's sibling group, widening to its parent once full. */
+	| RowCommand<"selectScope">
+	| RowCommand<
+			"move",
+			{
+				readonly offset: -1 | 1;
+				/** A viewport's worth of rows rather than one. */
+				readonly page: boolean;
+				/** Extends the selection to the row moved to. */
+				readonly extend: boolean;
+			}
+	  >
+	| RowCommand<"select", SelectOptions>
+	| RowCommand<"toggle", { readonly recursive: boolean }>
+	| RowCommand<"typeahead", { readonly key: string }>
+	| {
+			readonly type: "dismiss";
+			readonly clearSelection: boolean;
+			readonly clearFocus: boolean;
+	  };
+
+interface CommandInput extends TreeCommandBehavior {
+	readonly row: TreeRowModel;
+	readonly modifiers: TreeModifiers;
+}
+
+export interface PointerCommandInput extends CommandInput {
+	/** A pinned row selects without the expand-on-click its body would get. */
+	readonly source: "row" | "sticky";
+	readonly onTwistie: boolean;
+	/** `MouseEvent.detail`, so 2 on a double click. */
+	readonly detail: number;
+}
+
+export interface KeyboardCommandInput extends CommandInput {
+	readonly key: string;
+	readonly visibleRows: readonly TreeRowModel[];
+	/** Whether a control inside the row, not the row, has focus. */
+	readonly fromAction: boolean;
+	readonly selectedCount: number;
+	readonly hasFocusedRow: boolean;
+}
+
+interface KeyboardOutcome {
+	readonly commands: readonly TreeCommand[];
+	readonly preventDefault: boolean;
+	/** Set when a row action navigates, so the row takes focus back. */
+	readonly focusRowElementId: string | undefined;
+}
+
+const NO_COMMANDS: readonly TreeCommand[] = [];
+
+/** The keys the tree claims even while a row action has focus. */
+const NAVIGATION_KEYS: ReadonlySet<string> = new Set([
+	"ArrowDown",
+	"ArrowUp",
+	"ArrowLeft",
+	"ArrowRight",
+	"PageDown",
+	"PageUp",
+	"Home",
+	"End",
+]);
+
+const focusCommand = (id: string): TreeCommand => ({ type: "focus", id });
+const selectCommand = (
+	id: string,
+	options: Partial<SelectOptions> = {},
+): TreeCommand => ({
+	type: "select",
+	id,
+	toggle: false,
+	range: false,
+	preserveHidden: true,
+	...options,
+});
+const toggleCommand = (id: string, recursive = false): TreeCommand => ({
+	type: "toggle",
+	id,
+	recursive,
+});
+
+/** Whether the gesture adds to the selection rather than replacing it. */
+export function isSelectionModifier(
+	modifiers: TreeModifiers,
+	behavior: TreeCommandBehavior,
+): boolean {
+	if (!behavior.multiSelect) {
+		return false;
+	}
+	return behavior.multiSelectModifier === "alt"
+		? modifiers.altKey
+		: modifiers.ctrlKey || modifiers.metaKey;
+}
+
+/** Whether the gesture is about selection at all, ranges included. */
+export function isSelectionGesture(
+	modifiers: TreeModifiers,
+	behavior: TreeCommandBehavior,
+): boolean {
+	return (
+		isSelectionModifier(modifiers, behavior) ||
+		(behavior.multiSelect && modifiers.shiftKey)
+	);
+}
+
+/** The commands a click on `row` means, twistie clicks included. */
+export function pointerCommands(
+	input: PointerCommandInput,
+): readonly TreeCommand[] {
+	const { row, source, expandMode, detail, modifiers } = input;
+	const id = row.node.id;
+
+	if (isSelectionGesture(modifiers, input)) {
+		// Hidden rows drop out: a selection the user cannot see cannot be judged.
+		const select = selectCommand(id, {
+			toggle: isSelectionModifier(modifiers, input),
+			range: modifiers.shiftKey,
+			preserveHidden: false,
+		});
+		return source === "sticky" ? [select] : [focusCommand(id), select];
+	}
+
+	// Alt expands recursively unless it is the selection modifier.
+	const toggle = toggleCommand(
+		id,
+		modifiers.altKey && input.multiSelectModifier !== "alt",
+	);
+	if (input.onTwistie) {
+		return source === "sticky"
+			? [focusCommand(id), selectCommand(id), toggle]
+			: [focusCommand(id), toggle];
+	}
+	const togglesBody =
+		source === "row" &&
+		row.expanded !== undefined &&
+		(expandMode === "singleClick" ? detail <= 1 : detail === 2);
+	return togglesBody
+		? [focusCommand(id), selectCommand(id), toggle]
+		: [focusCommand(id), selectCommand(id)];
+}
+
+/** The commands a key press means, plus who keeps the event afterwards. */
+export function keyboardCommands(input: KeyboardCommandInput): KeyboardOutcome {
+	const { key, row, visibleRows, modifiers } = input;
+	const id = row.node.id;
+	// A key pressed inside a row action belongs to it, unless it navigates.
+	if (input.fromAction && !NAVIGATION_KEYS.has(key)) {
+		return {
+			commands: NO_COMMANDS,
+			preventDefault: false,
+			focusRowElementId: undefined,
+		};
+	}
+	const outcome = (
+		commands: readonly TreeCommand[],
+		preventDefault = true,
+	): KeyboardOutcome => ({
+		commands,
+		preventDefault,
+		focusRowElementId: input.fromAction ? id : undefined,
+	});
+	const selectionModifier = isSelectionModifier(modifiers, input);
+
+	// Ctrl/Cmd+A, which native scopes to the sibling group before widening.
+	if (
+		selectionModifier &&
+		!modifiers.shiftKey &&
+		key.toLocaleLowerCase() === "a"
+	) {
+		return outcome([{ type: "selectScope", id }]);
+	}
+
+	switch (key) {
+		case "ArrowDown":
+		case "ArrowUp":
+		case "PageDown":
+		case "PageUp": {
+			const page = key === "PageDown" || key === "PageUp";
+			const offset = key === "ArrowDown" || key === "PageDown" ? 1 : -1;
+			return outcome([
+				{
+					type: "move",
+					id,
+					offset,
+					page,
+					extend: !page && input.multiSelect && modifiers.shiftKey,
+				},
+			]);
+		}
+		case "Home":
+		case "End": {
+			const target = key === "Home" ? visibleRows[0] : visibleRows.at(-1);
+			return outcome(target ? [focusCommand(target.node.id)] : NO_COMMANDS);
+		}
+		case "ArrowRight": {
+			if (row.expanded === false) {
+				return outcome([toggleCommand(id)]);
+			}
+			const child = row.expanded
+				? visibleRows[visibleRows.indexOf(row) + 1]
+				: undefined;
+			return outcome(
+				child?.pathIds.includes(id)
+					? [focusCommand(child.node.id)]
+					: NO_COMMANDS,
+			);
+		}
+		case "ArrowLeft": {
+			if (row.expanded === true) {
+				return outcome([toggleCommand(id)]);
+			}
+			const parent = parentId(row);
+			return outcome(parent ? [focusCommand(parent)] : NO_COMMANDS);
+		}
+		case "Enter": {
+			// Ctrl+Shift+Enter toggles this row and leaves the rest selected.
+			if (selectionModifier && modifiers.shiftKey) {
+				return outcome([selectCommand(id, { toggle: true })]);
+			}
+			const select = selectCommand(id, { toggle: selectionModifier });
+			const alsoToggles =
+				row.expanded !== undefined && input.expandMode === "singleClick";
+			return outcome(alsoToggles ? [select, toggleCommand(id)] : [select]);
+		}
+		case " ":
+			// A leaf has nothing to toggle, so Space selects it instead.
+			return outcome([
+				row.expanded === undefined
+					? selectCommand(id, { toggle: selectionModifier })
+					: toggleCommand(id),
+			]);
+		case "Escape": {
+			const clearSelection = input.selectedCount > 0;
+			const clearFocus = input.selectedCount <= 1 && input.hasFocusedRow;
+			return outcome(
+				[{ type: "dismiss", clearSelection, clearFocus }],
+				clearSelection || input.hasFocusedRow,
+			);
+		}
+		default: {
+			// A bare printable key types ahead; anything else is the host's.
+			const typesAhead =
+				key.length === 1 &&
+				!modifiers.ctrlKey &&
+				!modifiers.metaKey &&
+				!modifiers.altKey;
+			return outcome(
+				typesAhead
+					? [{ type: "typeahead", id, key: key.toLocaleLowerCase() }]
+					: NO_COMMANDS,
+				typesAhead,
+			);
+		}
+	}
+}
diff --git a/packages/ui/src/components/Tree/treeTransition.ts b/packages/ui/src/components/Tree/treeTransition.ts
new file mode 100644
index 0000000000..42be5cb2ff
--- /dev/null
+++ b/packages/ui/src/components/Tree/treeTransition.ts
@@ -0,0 +1,512 @@
+/**
+ * The interaction state props cannot hold: focus, the tab stop, the selection
+ * anchor, the type-ahead buffer, and container focus. `deriveTreeInteractionView`
+ * reads it against the current model and resolves what the rows render;
+ * `transitionTree` folds commands into it.
+ */
+
+import { parentId, type TreeModel, type TreeRowModel } from "./treeModel";
+
+import type { TreeCommand } from "./treePolicy";
+
+/** How long a type-ahead query keeps collecting keys, as in the native list. */
+const TYPE_QUERY_MS = 800;
+
+/** The focused row, with its ancestors to fall back on if it disappears. */
+interface FocusTarget {
+	readonly id: string;
+	readonly pathIds: readonly string[];
+}
+
+export interface TreeInteractionState {
+	readonly focusTarget?: FocusTarget;
+	/** The row Tab returns to, which outlives a row leaving the viewport. */
+	readonly tabTargetId?: string;
+	/** The selection whose tab stop the user already moved away from. */
+	readonly dismissedSelectionKey?: string;
+	/** The selection the anchor belongs to; a new one from props resets it. */
+	readonly anchorKey: string;
+	/** Where a range selection measures from. */
+	readonly anchorId?: string;
+	readonly hasDomFocus: boolean;
+	readonly typeQuery?: string;
+	readonly typeExpires?: number;
+}
+
+/** What the rows render from, derived fresh on every render. */
+interface TreeInteractionView {
+	readonly state: TreeInteractionState;
+	readonly controlledKey: string;
+	readonly selectedIds: ReadonlySet<string>;
+	readonly focusedId: string | undefined;
+	readonly anchorId: string | undefined;
+	readonly guideOwnerIds: ReadonlySet<string>;
+	readonly tabStopId: string | undefined;
+}
+
+interface TransitionInput {
+	readonly model: TreeModel;
+	readonly controlledIds: readonly string[];
+	readonly expandedIds: readonly string[];
+	readonly multiSelect: boolean;
+	/** Rows a page key should travel, measured against the scroller. */
+	readonly pageOffset?: number;
+	readonly now: number;
+}
+
+interface TreeTransition {
+	readonly state: TreeInteractionState;
+	/** Set only when the commands changed it, since selection is controlled. */
+	readonly selection?: readonly string[];
+	readonly expandedIds?: readonly string[];
+	readonly focusTree: boolean;
+}
+
+/** Selections compare by value: the ids arrive fresh in props each render. */
+const selectionKey = (ids: readonly string[]): string =>
+	JSON.stringify([...new Set(ids)].sort());
+const NO_SELECTION_KEY = selectionKey([]);
+
+const focusTarget = (row: TreeRowModel): FocusTarget => ({
+	id: row.node.id,
+	pathIds: row.pathIds,
+});
+
+export function initialTreeInteractionState(
+	controlledIds: readonly string[],
+): TreeInteractionState {
+	return {
+		anchorKey: selectionKey(controlledIds),
+		anchorId: controlledIds[0],
+		hasDomFocus: false,
+	};
+}
+
+/**
+ * Points the state at rows the model still has, returning it unchanged when it
+ * already does; callers compare by identity to spot data moving under them.
+ */
+function reconcile(
+	state: TreeInteractionState,
+	model: TreeModel,
+): TreeInteractionState {
+	const { rowsById, visibleIds } = model;
+	if (state.focusTarget && !rowsById.has(state.focusTarget.id)) {
+		const fallbackId = state.focusTarget.pathIds.findLast((id) =>
+			visibleIds.has(id),
+		);
+		const fallback = fallbackId ? rowsById.get(fallbackId) : undefined;
+		return {
+			...state,
+			focusTarget: fallback ? focusTarget(fallback) : undefined,
+			tabTargetId: fallbackId,
+		};
+	}
+	if (state.tabTargetId && !rowsById.has(state.tabTargetId)) {
+		return { ...state, tabTargetId: undefined };
+	}
+	return state;
+}
+
+/** The guides VS Code draws solid: the paths down to selection and focus. */
+function activeGuideOwners(
+	visibleRows: readonly TreeRowModel[],
+	selectedIds: ReadonlySet<string>,
+	focusedId: string | undefined,
+): ReadonlySet<string> {
+	const owners = new Set<string>();
+	for (const row of visibleRows) {
+		if (!selectedIds.has(row.node.id) && focusedId !== row.node.id) {
+			continue;
+		}
+		const ownerId = row.expanded ? row.node.id : parentId(row);
+		if (ownerId) {
+			owners.add(ownerId);
+		}
+	}
+	return owners;
+}
+
+export function deriveTreeInteractionView(
+	state: TreeInteractionState,
+	model: TreeModel,
+	controlledIds: readonly string[],
+): TreeInteractionView {
+	const { visibleRows, rowsById, visibleIds } = model;
+	const nextState = reconcile(state, model);
+	const { focusTarget: focus, tabTargetId } = nextState;
+	const focusedId = focus && visibleIds.has(focus.id) ? focus.id : undefined;
+	// Focus kept out of view holds the tab stop, so Tab cannot move the user.
+	const hiddenFocus =
+		focus !== undefined && !focusedId && rowsById.has(focus.id);
+	const selectedIds = new Set(controlledIds);
+	const controlledKey = selectionKey(controlledIds);
+	const claimedSelection =
+		nextState.dismissedSelectionKey === controlledKey
+			? undefined
+			: visibleRows.find((row) => selectedIds.has(row.node.id))?.node.id;
+	const tabTarget =
+		tabTargetId && visibleIds.has(tabTargetId) ? tabTargetId : undefined;
+
+	return {
+		state: nextState,
+		controlledKey,
+		selectedIds,
+		focusedId,
+		anchorId:
+			nextState.anchorKey === controlledKey
+				? nextState.anchorId
+				: controlledIds[0],
+		guideOwnerIds: activeGuideOwners(
+			visibleRows,
+			selectedIds,
+			nextState.hasDomFocus ? focusedId : undefined,
+		),
+		tabStopId:
+			claimedSelection ??
+			tabTarget ??
+			(hiddenFocus ? undefined : visibleRows[0]?.node.id),
+	};
+}
+
+/** Adopts `row` as the focused row on first entry, never after. */
+export function treeFocusChanged(
+	state: TreeInteractionState,
+	focused: boolean,
+	row?: TreeRowModel,
+): TreeInteractionState {
+	if (!focused) {
+		return state.hasDomFocus ? { ...state, hasDomFocus: false } : state;
+	}
+	return {
+		...state,
+		focusTarget: state.focusTarget ?? (row ? focusTarget(row) : undefined),
+		hasDomFocus: true,
+	};
+}
+
+/** Focus moved to `row`, which also becomes the tab stop from now on. */
+export function rowFocused(
+	state: TreeInteractionState,
+	row: TreeRowModel,
+	controlledKey: string,
+): TreeInteractionState {
+	return {
+		...state,
+		focusTarget: focusTarget(row),
+		tabTargetId: row.node.id,
+		dismissedSelectionKey: controlledKey,
+	};
+}
+
+/**
+ * The native range: the run of selected rows around the anchor is released
+ * first, so shrinking a range back over itself deselects what it passes.
+ */
+function selectionRange(
+	visibleRows: readonly TreeRowModel[],
+	selectedIds: ReadonlySet<string>,
+	anchorId: string,
+	targetId: string,
+): Set<string> | undefined {
+	const rowIds = visibleRows.map((row) => row.node.id);
+	const anchor = rowIds.indexOf(anchorId);
+	const target = rowIds.indexOf(targetId);
+	if (anchor < 0 || target < 0) {
+		return undefined;
+	}
+	const ids = new Set(selectedIds);
+	let start = anchor;
+	let end = anchor;
+	while (start > 0 && ids.has(rowIds[start - 1] ?? "")) {
+		start--;
+	}
+	while (end < rowIds.length - 1 && ids.has(rowIds[end + 1] ?? "")) {
+		end++;
+	}
+	for (const id of rowIds.slice(start, end + 1)) {
+		ids.delete(id);
+	}
+	for (const id of rowIds.slice(
+		Math.min(anchor, target),
+		Math.max(anchor, target) + 1,
+	)) {
+		ids.add(id);
+	}
+	return ids;
+}
+
+interface SelectionResult {
+	readonly ids: ReadonlySet<string>;
+	readonly anchorId: string;
+}
+
+/** The selection a `select` command produces, and the anchor it leaves. */
+function selectRow(
+	model: TreeModel,
+	selectedIds: ReadonlySet<string>,
+	anchorId: string | undefined,
+	multiSelect: boolean,
+	row: TreeRowModel,
+	options: { toggle: boolean; range: boolean; preserveHidden: boolean },
+): SelectionResult {
+	const id = row.node.id;
+	if (!multiSelect) {
+		return { ids: new Set([id]), anchorId: id };
+	}
+	const ids = new Set(
+		options.preserveHidden
+			? selectedIds
+			: [...selectedIds].filter((selectedId) =>
+					model.visibleIds.has(selectedId),
+				),
+	);
+	if (options.range && anchorId) {
+		const rangeIds = selectionRange(model.visibleRows, ids, anchorId, id);
+		if (rangeIds) {
+			return { ids: rangeIds, anchorId };
+		}
+	}
+	if (options.toggle && ids.delete(id)) {
+		return { ids, anchorId: id };
+	}
+	if (!options.toggle) {
+		ids.clear();
+	}
+	ids.add(id);
+	return { ids, anchorId: id };
+}
+
+/**
+ * `list.selectAll` on a tree: the row's sibling group, widening to include the
+ * parent once that whole group is already selected.
+ */
+function scopedSelection(
+	model: TreeModel,
+	selectedIds: ReadonlySet<string>,
+	row: TreeRowModel,
+): Set<string> {
+	const scopeId = parentId(row);
+	const scoped = model.rows.filter(
+		(candidate) => scopeId === undefined || candidate.pathIds.includes(scopeId),
+	);
+	const ids = new Set(scoped.map((candidate) => candidate.node.id));
+	const scope = scopeId ? model.rowsById.get(scopeId) : undefined;
+	if (
+		scope &&
+		scoped.every((candidate) => selectedIds.has(candidate.node.id))
+	) {
+		ids.add(scope.node.id);
+	}
+	return ids;
+}
+
+function togglingBranches(
+	row: TreeRowModel,
+	model: TreeModel,
+	recursive: boolean,
+): readonly TreeRowModel[] {
+	if (!recursive) {
+		return [row];
+	}
+	return model.rows.filter(
+		(candidate) =>
+			candidate.node.children !== undefined &&
+			(candidate === row || candidate.pathIds.includes(row.node.id)),
+	);
+}
+
+/**
+ * Expansion is data, so the ids come back in tree order. Ids the data does not
+ * have are kept, so a branch that loads later reopens.
+ */
+function toggleExpansion(
+	row: TreeRowModel,
+	model: TreeModel,
+	expandedIds: readonly string[],
+	recursive: boolean,
+): readonly string[] {
+	const next = new Set(expandedIds);
+	for (const branch of togglingBranches(row, model, recursive)) {
+		if (row.expanded) {
+			next.delete(branch.node.id);
+		} else {
+			next.add(branch.node.id);
+		}
+	}
+	return [
+		...model.rows
+			.filter((candidate) => next.has(candidate.node.id))
+			.map((candidate) => candidate.node.id),
+		...[...next].filter((id) => !model.rowsById.has(id)),
+	];
+}
+
+/**
+ * Prefix first, then a fuzzy subsequence, as the native list does. A repeated
+ * single key walks the rows starting with it instead of matching the run.
+ */
+function typeaheadMatch(
+	visibleRows: readonly TreeRowModel[],
+	query: string,
+	current: TreeRowModel,
+): TreeRowModel | undefined {
+	const repeated =
+		query.length > 1 && [...query].every((key) => key === query[0]);
+	const value = (repeated ? query[0] : query)?.toLocaleLowerCase() ?? "";
+	const from =
+		query.length === 1 || repeated
+			? visibleRows.indexOf(current) + 1
+			: visibleRows.indexOf(current);
+	const ordered = visibleRows.map(
+		(_, offset) => visibleRows[(from + offset) % visibleRows.length],
+	);
+	const fuzzy = (row: TreeRowModel): boolean => {
+		let index = 0;
+		for (const character of row.textValue.toLocaleLowerCase()) {
+			if (character === value[index] && ++index === value.length) {
+				return true;
+			}
+		}
+		return false;
+	};
+	return (
+		ordered.find((row) =>
+			row?.textValue.toLocaleLowerCase().startsWith(value),
+		) ?? ordered.find((row) => row && fuzzy(row))
+	);
+}
+
+export function transitionTree(
+	state: TreeInteractionState,
+	commands: readonly TreeCommand[],
+	input: TransitionInput,
+): TreeTransition {
+	const { model } = input;
+	const view = deriveTreeInteractionView(state, model, input.controlledIds);
+	let nextState = view.state;
+	let selectedIds = view.selectedIds;
+	let currentKey = view.controlledKey;
+	let anchorId = view.anchorId;
+	let selection: readonly string[] | undefined;
+	let expandedIds: readonly string[] | undefined;
+	let focusTree = false;
+
+	const setAnchor = (id: string | undefined): void => {
+		anchorId = id;
+		nextState = { ...nextState, anchorKey: currentKey, anchorId: id };
+	};
+	const select = (ids: ReadonlySet<string>, nextAnchor?: string): void => {
+		selection = model.rows
+			.filter((row) => ids.has(row.node.id))
+			.map((row) => row.node.id);
+		selectedIds = new Set(selection);
+		currentKey = selectionKey(selection);
+		nextState = { ...nextState, dismissedSelectionKey: currentKey };
+		if (nextAnchor !== undefined) {
+			setAnchor(nextAnchor);
+		}
+	};
+	const focus = (row: TreeRowModel | undefined): void => {
+		if (!row || !model.visibleIds.has(row.node.id)) {
+			return;
+		}
+		nextState = rowFocused(nextState, row, currentKey);
+		focusTree = true;
+	};
+
+	for (const command of commands) {
+		const row = "id" in command ? model.rowsById.get(command.id) : undefined;
+		switch (command.type) {
+			case "focus":
+				focus(row);
+				break;
+			case "select":
+				if (row) {
+					const result = selectRow(
+						model,
+						selectedIds,
+						anchorId,
+						input.multiSelect,
+						row,
+						command,
+					);
+					select(result.ids, result.anchorId);
+				}
+				break;
+			case "selectScope":
+				if (row) {
+					select(scopedSelection(model, selectedIds, row));
+				}
+				break;
+			case "move": {
+				if (!row) {
+					break;
+				}
+				const rows = model.visibleRows;
+				const offset = command.page
+					? (input.pageOffset ?? command.offset)
+					: command.offset;
+				const index = rows.indexOf(row) + offset;
+				const target = rows[Math.min(Math.max(index, 0), rows.length - 1)];
+				if (!target) {
+					break;
+				}
+				if (command.extend) {
+					const rangeAnchor = anchorId ?? row.node.id;
+					const ids = selectionRange(
+						rows,
+						selectedIds,
+						rangeAnchor,
+						target.node.id,
+					);
+					if (ids) {
+						select(ids, rangeAnchor);
+					}
+				} else {
+					setAnchor(target.node.id);
+				}
+				focus(target);
+				break;
+			}
+			case "toggle":
+				if (row?.expanded !== undefined) {
+					expandedIds = toggleExpansion(
+						row,
+						model,
+						expandedIds ?? input.expandedIds,
+						command.recursive,
+					);
+				}
+				break;
+			case "typeahead": {
+				if (!row) {
+					break;
+				}
+				const query =
+					nextState.typeQuery && input.now < (nextState.typeExpires ?? 0)
+						? nextState.typeQuery + command.key
+						: command.key;
+				nextState = {
+					...nextState,
+					typeQuery: query,
+					typeExpires: input.now + TYPE_QUERY_MS,
+				};
+				focus(typeaheadMatch(model.visibleRows, query, row));
+				break;
+			}
+			case "dismiss":
+				if (command.clearSelection) {
+					select(new Set());
+				}
+				if (command.clearFocus) {
+					nextState = { ...nextState, focusTarget: undefined };
+					focusTree = true;
+				}
+				currentKey = NO_SELECTION_KEY;
+				setAnchor(undefined);
+				break;
+		}
+	}
+	return { state: nextState, selection, expandedIds, focusTree };
+}
diff --git a/packages/ui/src/components/Tree/useTreeAdapter.ts b/packages/ui/src/components/Tree/useTreeAdapter.ts
new file mode 100644
index 0000000000..af66f89106
--- /dev/null
+++ b/packages/ui/src/components/Tree/useTreeAdapter.ts
@@ -0,0 +1,339 @@
+import {
+	type KeyboardEvent,
+	type MouseEvent,
+	useMemo,
+	useRef,
+	useState,
+} from "react";
+
+import {
+	closestRow,
+	hitTwistie,
+	nestedInteractiveTarget,
+	scrollableAncestor,
+} from "./rowDom";
+import {
+	createTreeModel,
+	ROW_HEIGHT_PX,
+	rowTooltip,
+	type TreeNode,
+	type TreeRowModel,
+} from "./treeModel";
+import {
+	isSelectionGesture,
+	keyboardCommands,
+	pointerCommands,
+	type TreeCommand,
+	type TreeCommandBehavior,
+	type TreeExpandMode,
+	type TreeMultiSelectModifier,
+} from "./treePolicy";
+import {
+	deriveTreeInteractionView,
+	initialTreeInteractionState,
+	rowFocused,
+	transitionTree,
+	treeFocusChanged,
+	type TreeInteractionState,
+} from "./treeTransition";
+
+import type { TreeHoverControl } from "./TreeHover";
+
+const NO_IDS: readonly string[] = [];
+const NO_GUIDES = "";
+const MODIFIER_KEYS: ReadonlySet<string> = new Set([
+	"Alt",
+	"Control",
+	"Meta",
+	"Shift",
+]);
+
+/** Single selection, or multi-selection, never a mix of the two APIs. */
+export type SelectionProps =
+	| {
+			readonly multiSelect?: false;
+			readonly selectedItemId?: string;
+			readonly onSelectedItemChange?: (itemId: string | undefined) => void;
+			readonly selectedItemIds?: never;
+			readonly onSelectedItemsChange?: never;
+	  }
+	| {
+			readonly multiSelect: true;
+			readonly selectedItemIds?: readonly string[];
+			readonly onSelectedItemsChange?: (itemIds: readonly string[]) => void;
+			readonly selectedItemId?: never;
+			readonly onSelectedItemChange?: never;
+	  };
+
+interface AdapterOptions {
+	readonly nodes: readonly TreeNode[];
+	readonly expandedIds: readonly string[];
+	readonly onExpandedIdsChange?: (expandedIds: readonly string[]) => void;
+	readonly expandMode: TreeExpandMode;
+	readonly multiSelectModifier: TreeMultiSelectModifier;
+	readonly onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void;
+	readonly treeRef: React.RefObject<HTMLDivElement | null>;
+	readonly hoverControl?: TreeHoverControl;
+}
+
+function rowElement(tree: HTMLElement | null, id: string): HTMLElement | null {
+	return (
+		tree?.querySelector<HTMLElement>(`[data-tree-id="${CSS.escape(id)}"]`) ??
+		null
+	);
+}
+
+function controlledIds(selection: SelectionProps): readonly string[] {
+	if (selection.multiSelect) {
+		return selection.selectedItemIds ?? NO_IDS;
+	}
+	return selection.selectedItemId === undefined
+		? NO_IDS
+		: [selection.selectedItemId];
+}
+
+/**
+ * Where the pure modules meet React and the DOM. Events arrive delegated from
+ * the container, which leaves rows as memoized presentation.
+ */
+export function useTreeAdapter(options: AdapterOptions & SelectionProps) {
+	const { nodes, expandedIds, treeRef } = options;
+	// Explicit: memoized rows compare against these row objects, and a consumer
+	// of the published package may not run the React Compiler.
+	const model = useMemo(
+		() => createTreeModel(nodes, new Set(expandedIds)),
+		[nodes, expandedIds],
+	);
+	const { visibleRows, rowsById } = model;
+	const selected = controlledIds(options);
+	const chordRef = useRef(false);
+	const [state, setState] = useState<TreeInteractionState>(() =>
+		initialTreeInteractionState(selected),
+	);
+	const view = deriveTreeInteractionView(state, model, selected);
+	// Identity, not value: the view returns this same state unless the data
+	// moved, and then the reconciled one renders instead.
+	if (view.state !== state) {
+		setState(view.state);
+	}
+	const behavior: TreeCommandBehavior = {
+		expandMode: options.expandMode,
+		multiSelect: Boolean(options.multiSelect),
+		multiSelectModifier: options.multiSelectModifier,
+	};
+
+	/**
+	 * How far a page key travels: to the far edge of the viewport, or a whole
+	 * viewport once the focused row is already sitting on it.
+	 */
+	const pageOffset = (row: TreeRowModel, direction: 1 | -1): number => {
+		const tree = treeRef.current;
+		const scroller = tree ? scrollableAncestor(tree) : undefined;
+		if (!tree || !scroller) {
+			return direction;
+		}
+		const viewport = scroller.getBoundingClientRect();
+		if (viewport.height > 0) {
+			const inView = [
+				...tree.querySelectorAll<HTMLElement>("[data-tree-id]"),
+			].filter((element) => {
+				const bounds = element.getBoundingClientRect();
+				return bounds.bottom > viewport.top && bounds.top < viewport.bottom;
+			});
+			const edge = direction === 1 ? inView.at(-1) : inView[0];
+			const edgeId = edge?.dataset.treeId;
+			const edgeRow = edgeId ? rowsById.get(edgeId) : undefined;
+			const offset = edgeRow
+				? visibleRows.indexOf(edgeRow) - visibleRows.indexOf(row)
+				: 0;
+			if (offset !== 0) {
+				return offset;
+			}
+			scroller.scrollBy?.(0, direction * scroller.clientHeight);
+		}
+		return (
+			direction * Math.max(1, Math.floor(scroller.clientHeight / ROW_HEIGHT_PX))
+		);
+	};
+
+	const dispatch = (commands: readonly TreeCommand[]): void => {
+		const move = commands.find((command) => command.type === "move");
+		const moved = move ? rowsById.get(move.id) : undefined;
+		const result = transitionTree(state, commands, {
+			model,
+			controlledIds: selected,
+			expandedIds,
+			multiSelect: behavior.multiSelect,
+			pageOffset:
+				move?.page && moved ? pageOffset(moved, move.offset) : undefined,
+			now: Date.now(),
+		});
+		setState(result.state);
+		if (result.selection) {
+			if (options.multiSelect) {
+				options.onSelectedItemsChange?.(result.selection);
+			} else {
+				options.onSelectedItemChange?.(result.selection[0]);
+			}
+		}
+		if (result.expandedIds) {
+			options.onExpandedIdsChange?.(result.expandedIds);
+		}
+		if (result.focusTree) {
+			treeRef.current?.focus();
+		}
+	};
+
+	const rowFor = (target: EventTarget | null): TreeRowModel | undefined => {
+		const id = closestRow(target)?.dataset.treeId;
+		return id ? rowsById.get(id) : undefined;
+	};
+	const onFocusIn = (target: EventTarget | null): void => {
+		const row = rowFor(target);
+		// A row focused in its own right becomes the focus target; entering the
+		// container only adopts one.
+		if (row && target === closestRow(target)) {
+			setState((current) => rowFocused(current, row, view.controlledKey));
+		}
+		// Only an entry with no focus target adopts a row: a focus mark the same
+		// gesture just cleared must not come back when focus returns here.
+		const entered = view.state.focusTarget
+			? undefined
+			: (row ?? rowsById.get(view.tabStopId ?? ""));
+		setState((current) => treeFocusChanged(current, true, entered));
+	};
+	const onPointer = (
+		row: TreeRowModel,
+		event: MouseEvent,
+		onTwistie: boolean,
+		source: "row" | "sticky",
+	): void => {
+		dispatch(
+			pointerCommands({
+				...behavior,
+				row,
+				source,
+				onTwistie,
+				detail: event.detail,
+				modifiers: event,
+			}),
+		);
+	};
+	const onClick = (event: MouseEvent<HTMLDivElement>): void => {
+		const element = closestRow(event.target);
+		const row = rowFor(event.target);
+		if (!row || !element) {
+			return;
+		}
+		// Focusable content and the action bar handle their own clicks.
+		if (
+			nestedInteractiveTarget(event.target, element) ||
+			(event.target instanceof Element &&
+				event.target.closest(".ui-tree-item__action"))
+		) {
+			return;
+		}
+		onPointer(row, event, hitTwistie(row, event.target), "row");
+	};
+	/** VS Code binds `list.showHover` to the Ctrl+K Ctrl+I chord. */
+	const showHoverChord = (
+		event: KeyboardEvent<HTMLDivElement>,
+	): "pending" | "show" | undefined => {
+		const held = (event.ctrlKey || event.metaKey) && !event.altKey;
+		const key = held ? event.key.toLowerCase() : "";
+		const armed = chordRef.current;
+		chordRef.current = !armed && key === "k";
+		if (chordRef.current) {
+			return "pending";
+		}
+		return armed && key === "i" ? "show" : undefined;
+	};
+	const showHover = (row: TreeRowModel | undefined): void => {
+		const element = row
+			? rowElement(treeRef.current, row.node.id)?.querySelector<HTMLElement>(
+					".ui-tree-item__content",
+				)
+			: undefined;
+		options.hoverControl?.current?.(
+			row && element ? { content: rowTooltip(row), element } : undefined,
+			true,
+		);
+	};
+	const onKeyDown = (event: KeyboardEvent<HTMLDivElement>): void => {
+		options.onKeyDown?.(event);
+		if (event.defaultPrevented) {
+			return;
+		}
+		const row =
+			rowFor(event.target) ??
+			(view.focusedId ? rowsById.get(view.focusedId) : undefined) ??
+			(view.tabStopId ? rowsById.get(view.tabStopId) : undefined) ??
+			visibleRows[0];
+		if (!row) {
+			return;
+		}
+		// A hover the keyboard opened stays only until the next real key.
+		if (!MODIFIER_KEYS.has(event.key)) {
+			const chord = showHoverChord(event);
+			if (chord) {
+				if (chord === "show") {
+					showHover(row);
+				}
+				event.preventDefault();
+				return;
+			}
+			showHover(undefined);
+		}
+		const interactive = nestedInteractiveTarget(
+			event.target,
+			event.currentTarget,
+		);
+		const result = keyboardCommands({
+			...behavior,
+			key: event.key,
+			row,
+			visibleRows,
+			fromAction:
+				interactive instanceof HTMLElement &&
+				interactive.dataset.treeId === undefined,
+			selectedCount: view.selectedIds.size,
+			hasFocusedRow: view.focusedId !== undefined,
+			modifiers: event,
+		});
+		if (result.focusRowElementId) {
+			rowElement(treeRef.current, result.focusRowElementId)?.focus();
+		}
+		dispatch(result.commands);
+		if (result.preventDefault) {
+			event.preventDefault();
+		}
+	};
+
+	return {
+		model,
+		focusedId: view.focusedId,
+		tabStopId: view.tabStopId,
+		hasDomFocus: view.state.hasDomFocus,
+		selectedIds: view.selectedIds,
+		/** One character per ancestor, `1` where its guide is active. */
+		guideFlags: (row: TreeRowModel): string =>
+			view.guideOwnerIds.size === 0
+				? NO_GUIDES
+				: row.pathIds
+						.map((id) => (view.guideOwnerIds.has(id) ? "1" : "0"))
+						.join(""),
+		dispatch,
+		isSelectionGesture: (event: MouseEvent) =>
+			isSelectionGesture(event, behavior),
+		onFocusIn,
+		onBlurOut: () => {
+			showHover(undefined);
+			setState((current) => treeFocusChanged(current, false));
+		},
+		onClick,
+		onPointer,
+		onKeyDown,
+	};
+}
+
+export type TreeAdapter = ReturnType<typeof useTreeAdapter>;
diff --git a/packages/ui/src/components/overlay.css b/packages/ui/src/components/overlay.css
index a5c9a086bd..00026705b8 100644
--- a/packages/ui/src/components/overlay.css
+++ b/packages/ui/src/components/overlay.css
@@ -11,8 +11,40 @@
 	z-index: var(--ui-z-index-overlay);
 }
 
+/* Highlightable rows; surfaces map their colors onto the
+   --ui-overlay-highlight-* names and keep their own geometry. */
+.ui-overlay__item {
+	border-radius: var(--ui-radius-medium);
+	cursor: default;
+	user-select: none;
+	outline: 1px solid transparent;
+	outline-offset: -1px;
+}
+
+/* An open submenu keeps its parent row highlighted, like native; the
+   selection border only resolves in high contrast. */
+.ui-overlay__item:is([data-highlighted], [data-state="open"]) {
+	forced-color-adjust: none;
+	color: var(--ui-overlay-highlight-foreground);
+	background: var(--ui-overlay-highlight-background);
+	outline-color: var(--ui-overlay-highlight-outline, transparent);
+}
+
+.ui-overlay__item[data-disabled] {
+	color: var(--ui-disabled-foreground);
+}
+
 @media (forced-colors: active) {
 	.ui-overlay {
 		border-color: CanvasText;
 	}
+
+	.ui-overlay__item:is([data-highlighted], [data-state="open"]) {
+		color: HighlightText;
+		background: Highlight;
+	}
+
+	.ui-overlay__item[data-disabled] {
+		color: GrayText;
+	}
 }
diff --git a/packages/ui/src/components/text-control.css b/packages/ui/src/components/text-control.css
new file mode 100644
index 0000000000..e2ec7e3a30
--- /dev/null
+++ b/packages/ui/src/components/text-control.css
@@ -0,0 +1,46 @@
+/* Shared text-control paint and inner-input layout; component files own
+   padding and native-element behavior. */
+.ui-text-control {
+	width: 100%;
+	color: var(--ui-input-foreground);
+	background: var(--ui-input-background);
+	border: 1px solid var(--ui-input-border);
+	border-radius: var(--ui-radius-small);
+}
+
+/* Single-line controls also carry .ui-control and keep the native 26px box */
+.ui-control.ui-text-control {
+	justify-content: flex-start;
+	height: 26px;
+}
+
+.ui-text-control:focus-within {
+	border-color: var(--ui-focus-border);
+}
+
+.ui-text-control__control {
+	min-width: 0;
+	flex: 1;
+	color: inherit;
+	background: transparent;
+	border: 0;
+	outline: 0;
+	font: inherit;
+}
+
+.ui-text-control::placeholder,
+.ui-text-control__control::placeholder {
+	color: var(--ui-input-placeholder-foreground);
+	opacity: 1;
+}
+
+/* Trailing in-field buttons: the password reveal and the search clear */
+.ui-text-control__action {
+	flex: none;
+	margin-inline-end: 1px;
+}
+
+.ui-text-control:disabled,
+.ui-text-control:has(> :disabled) {
+	opacity: var(--ui-disabled-opacity);
+}
diff --git a/packages/ui/src/index.ts b/packages/ui/src/index.ts
index 89b11ffb0a..d6278d896e 100644
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@@ -1,4 +1,5 @@
 export { Button, type ButtonProps } from "./components/Button/Button";
+export { Checkbox, type CheckboxProps } from "./components/Checkbox/Checkbox";
 export {
 	EmptyState,
 	type EmptyStateProps,
@@ -7,15 +8,26 @@ export {
 	ErrorState,
 	type ErrorStateProps,
 } from "./components/ErrorState/ErrorState";
+export {
+	Field,
+	type FieldProps,
+	Label,
+	type LabelProps,
+} from "./components/Field/Field";
 export { Icon, type IconProps } from "./components/Icon/Icon";
 export {
 	IconButton,
 	type IconButtonProps,
 } from "./components/IconButton/IconButton";
+export { Input, type InputProps } from "./components/Input/Input";
 export {
 	LoadingState,
 	type LoadingStateProps,
 } from "./components/LoadingState/LoadingState";
+export {
+	PasswordInput,
+	type PasswordInputProps,
+} from "./components/PasswordInput/PasswordInput";
 export {
 	ProgressBar,
 	type ProgressBarProps,
@@ -24,12 +36,21 @@ export {
 	SearchInput,
 	type SearchInputProps,
 } from "./components/SearchInput/SearchInput";
+export {
+	Select,
+	SelectContent,
+	SelectItem,
+	type SelectItemProps,
+	SelectTrigger,
+	SelectValue,
+} from "./components/Select/Select";
 export { Spinner, type SpinnerProps } from "./components/Spinner/Spinner";
 export {
 	StatusPill,
 	type StatusPillProps,
 	type StatusPillTone,
 } from "./components/StatusPill/StatusPill";
+export { Textarea, type TextareaProps } from "./components/Textarea/Textarea";
 export type { CodiconName } from "./codicons";
 export {
 	ContextMenu,
@@ -67,9 +88,14 @@ export {
 	type KeybindingPlatform,
 } from "./keybinding";
 export {
+	type HoverDelegate,
+	HoverDelegateScope,
+	type HoverTarget,
 	Tooltip,
 	type TooltipProps,
 	TooltipProvider,
 	type TooltipProviderProps,
 } from "./components/Tooltip/Tooltip";
+export { Tree, type TreeProps } from "./components/Tree/Tree";
+export type { TreeNode } from "./components/Tree/treeModel";
 export { useVscodeTheme, type VscodeThemeKind } from "./useVscodeTheme";
diff --git a/packages/ui/src/ref.ts b/packages/ui/src/ref.ts
new file mode 100644
index 0000000000..1ceeaca75b
--- /dev/null
+++ b/packages/ui/src/ref.ts
@@ -0,0 +1,16 @@
+import type { Ref } from "react";
+
+/**
+ * Hands a node to a consumer's `ref` prop, whichever form it takes, so a
+ * component can keep its own ref to a node it also forwards.
+ */
+export function setForwardedRef<T>(
+	ref: Ref<T> | undefined,
+	value: T | null,
+): void {
+	if (typeof ref === "function") {
+		ref(value);
+	} else if (ref) {
+		ref.current = value;
+	}
+}
diff --git a/packages/ui/src/tokens.css b/packages/ui/src/tokens.css
index e4345fa09f..7a15db40ca 100644
--- a/packages/ui/src/tokens.css
+++ b/packages/ui/src/tokens.css
@@ -79,6 +79,44 @@
 		var(--vscode-contrastBorder, transparent)
 	);
 	--ui-input-placeholder-foreground: var(--vscode-input-placeholderForeground);
+	--ui-checkbox-background: var(
+		--vscode-checkbox-background,
+		var(--ui-input-background)
+	);
+	--ui-checkbox-foreground: var(
+		--vscode-checkbox-foreground,
+		var(--ui-input-foreground)
+	);
+	--ui-checkbox-border: var(
+		--vscode-checkbox-border,
+		var(--vscode-contrastBorder, var(--ui-input-border))
+	);
+	--ui-dropdown-background: var(
+		--vscode-dropdown-background,
+		var(--ui-input-background)
+	);
+	--ui-dropdown-foreground: var(
+		--vscode-dropdown-foreground,
+		var(--ui-foreground)
+	);
+	--ui-dropdown-border: var(
+		--vscode-dropdown-border,
+		var(--vscode-contrastBorder, transparent)
+	);
+	--ui-dropdown-list-background: var(
+		--vscode-dropdown-listBackground,
+		var(--ui-dropdown-background)
+	);
+	/* Native select dropdowns highlight rows with the quick input list colors
+	   (selectBoxStyles) and outline them with --ui-list-selection-outline. */
+	--ui-dropdown-list-focus-background: var(
+		--vscode-quickInputList-focusBackground,
+		var(--vscode-list-activeSelectionBackground, transparent)
+	);
+	--ui-dropdown-list-focus-foreground: var(
+		--vscode-quickInputList-focusForeground,
+		var(--vscode-list-activeSelectionForeground, var(--ui-dropdown-foreground))
+	);
 	--ui-button-background: var(--vscode-button-background, var(--ui-background));
 	--ui-button-foreground: var(--vscode-button-foreground, var(--ui-foreground));
 	--ui-button-border: var(
@@ -147,11 +185,70 @@
 	--ui-radius-circle: var(--vscode-cornerRadius-circle, 9999px);
 
 	/* Spacing, VS Code's scale (baseSizes.ts); names are px times ten */
+	--ui-spacing-40: var(--vscode-spacing-size40, 4px);
 	--ui-spacing-60: var(--vscode-spacing-size60, 6px);
 	--ui-spacing-120: var(--vscode-spacing-size120, 12px);
 	--ui-spacing-160: var(--vscode-spacing-size160, 16px);
 	--ui-spacing-240: var(--vscode-spacing-size240, 24px);
 
+	/* Lists and trees */
+	--ui-list-hover-background: var(--vscode-list-hoverBackground, transparent);
+	--ui-list-hover-foreground: var(
+		--vscode-list-hoverForeground,
+		var(--ui-foreground)
+	);
+	--ui-list-active-selection-background: var(
+		--vscode-list-activeSelectionBackground,
+		var(--ui-list-hover-background)
+	);
+	--ui-list-active-selection-foreground: var(
+		--vscode-list-activeSelectionForeground,
+		var(--ui-foreground)
+	);
+	--ui-list-inactive-selection-background: var(
+		--vscode-list-inactiveSelectionBackground,
+		var(--ui-list-active-selection-background)
+	);
+	--ui-list-inactive-selection-foreground: var(
+		--vscode-list-inactiveSelectionForeground,
+		var(--ui-foreground)
+	);
+	--ui-list-focus-outline: var(
+		--vscode-list-focusOutline,
+		var(--ui-focus-border)
+	);
+	/* No list.selectionOutline or list.hoverOutline color exists; native feeds
+	   both from activeContrastBorder. */
+	--ui-list-selection-outline: var(--vscode-contrastActiveBorder, transparent);
+	--ui-list-inactive-focus-outline: var(
+		--vscode-list-inactiveFocusOutline,
+		transparent
+	);
+	--ui-list-hover-outline: var(--vscode-contrastActiveBorder, transparent);
+	--ui-list-focus-and-selection-outline: var(
+		--vscode-list-focusAndSelectionOutline,
+		var(--vscode-contrastActiveBorder, var(--ui-list-focus-outline))
+	);
+	/* Outside a webview, approximate the native guides (inactive is the
+	   active stroke at 40%) instead of disappearing. */
+	--ui-tree-indent-guide-inactive: var(
+		--vscode-tree-inactiveIndentGuidesStroke,
+		color-mix(in srgb, currentColor 16%, transparent)
+	);
+	--ui-tree-indent-guide-active: var(
+		--vscode-tree-indentGuidesStroke,
+		color-mix(in srgb, currentColor 40%, transparent)
+	);
+	/* Pinned rows paint over what scrolls beneath them. */
+	--ui-tree-sticky-background: var(
+		--vscode-sideBarStickyScroll-background,
+		var(--ui-background)
+	);
+	--ui-tree-sticky-shadow: var(
+		--vscode-sideBarStickyScroll-shadow,
+		transparent
+	);
+
 	/* Menus */
 	--ui-menu-background: var(--vscode-menu-background);
 	--ui-menu-foreground: var(--vscode-menu-foreground);
diff --git a/packages/ui/src/vscode-parity.stories.tsx b/packages/ui/src/vscode-parity.stories.tsx
index d37c2067f4..d34d7407c4 100644
--- a/packages/ui/src/vscode-parity.stories.tsx
+++ b/packages/ui/src/vscode-parity.stories.tsx
@@ -1,16 +1,21 @@
 import {
 	VscodeBadge,
 	VscodeButton,
+	VscodeCheckbox,
 	VscodeContextMenu,
 	VscodeIcon,
+	VscodeOption,
 	VscodeProgressBar,
 	VscodeProgressRing,
+	VscodeSingleSelect,
+	VscodeTextarea,
 	VscodeTextfield,
 	VscodeToolbarButton,
 } from "@vscode-elements/react-elements";
 import { useState } from "react";
 
 import { Button } from "./components/Button/Button";
+import { Checkbox } from "./components/Checkbox/Checkbox";
 import {
 	DropdownMenu,
 	DropdownMenuContent,
@@ -20,11 +25,20 @@ import {
 	DropdownMenuTrigger,
 } from "./components/DropdownMenu/DropdownMenu";
 import { IconButton } from "./components/IconButton/IconButton";
+import { Input } from "./components/Input/Input";
 import { ProgressBar } from "./components/ProgressBar/ProgressBar";
 import { SearchInput } from "./components/SearchInput/SearchInput";
+import {
+	Select,
+	SelectContent,
+	SelectItem,
+	SelectTrigger,
+	SelectValue,
+} from "./components/Select/Select";
 import { Spinner } from "./components/Spinner/Spinner";
 import { StatusPill } from "./components/StatusPill/StatusPill";
-import { openMenu, PIXEL_ALL_THEMES } from "./storybook";
+import { Textarea } from "./components/Textarea/Textarea";
+import { PIXEL_ALL_THEMES } from "./storybook";
 
 import type { Meta, StoryObj } from "@storybook/react-vite";
 
@@ -116,6 +130,37 @@ const Parity = (): React.JSX.Element => (
 				</VscodeTextfield>
 			}
 		/>
+		<Row
+			label="Input"
+			ours={
+				<Input
+					value="us-pittsburgh"
+					onChange={() => undefined}
+					aria-label="Region"
+					style={{ width: "180px" }}
+				/>
+			}
+			reference={
+				<VscodeTextfield value="us-pittsburgh" style={{ width: "180px" }} />
+			}
+		/>
+		<Row
+			label="Textarea"
+			ours={
+				<Textarea
+					value={"#!/bin/sh\necho hello"}
+					onChange={() => undefined}
+					aria-label="Init script"
+					style={{ width: "180px" }}
+				/>
+			}
+			reference={
+				<VscodeTextarea
+					value={"#!/bin/sh\necho hello"}
+					style={{ width: "180px" }}
+				/>
+			}
+		/>
 		<Row
 			label="Button"
 			// Narrower than the reference by design: VS Code core's
@@ -133,6 +178,37 @@ const Parity = (): React.JSX.Element => (
 				</>
 			}
 		/>
+		<Row
+			label="Select"
+			ours={
+				<Select value="us-pittsburgh" onValueChange={() => undefined}>
+					<SelectTrigger aria-label="Region" style={{ width: "180px" }}>
+						<SelectValue />
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value="us-pittsburgh">US East (Pittsburgh)</SelectItem>
+						<SelectItem value="eu-helsinki">EU North (Helsinki)</SelectItem>
+					</SelectContent>
+				</Select>
+			}
+			reference={
+				<VscodeSingleSelect style={{ width: "180px" }}>
+					<VscodeOption value="us-pittsburgh" selected>
+						US East (Pittsburgh)
+					</VscodeOption>
+					<VscodeOption value="eu-helsinki">EU North (Helsinki)</VscodeOption>
+				</VscodeSingleSelect>
+			}
+		/>
+		<Row
+			label="Checkbox"
+			ours={
+				<Checkbox checked onChange={() => undefined}>
+					Start on connect
+				</Checkbox>
+			}
+			reference={<VscodeCheckbox label="Start on connect" checked />}
+		/>
 		<Row
 			label="Link"
 			ours={
@@ -177,23 +253,34 @@ const Parity = (): React.JSX.Element => (
 	</div>
 );
 
-/* The reference menu renders inline; ours is a real portalled DropdownMenu,
-   so the play function opens it under its trigger. */
+/* defaultOpen + an invisible trigger mirror the reference's `show`. */
 const MenuParity = (): React.JSX.Element => (
 	<div
 		style={{
 			display: "grid",
 			gridTemplateColumns: "220px 220px",
-			gap: "16px",
+			gap: "8px 16px",
 			alignItems: "start",
 			fontSize: "13px",
 		}}
 	>
-		<DropdownMenu>
-			<DropdownMenuTrigger asChild>
-				<Button variant="secondary">Menu</Button>
+		<DropdownMenu defaultOpen>
+			<DropdownMenuTrigger asChild aria-label="Menu">
+				{/* A zero-height button still anchors the popper, so the menu opens
+					    at the top of its grid column, level with the reference. */}
+				<button
+					type="button"
+					style={{
+						display: "block",
+						width: "100%",
+						height: 0,
+						padding: 0,
+						border: 0,
+						opacity: 0,
+					}}
+				/>
 			</DropdownMenuTrigger>
-			<DropdownMenuContent>
+			<DropdownMenuContent sideOffset={0}>
 				<DropdownMenuItem>Start workspace</DropdownMenuItem>
 				<DropdownMenuItem>Open logs</DropdownMenuItem>
 				<DropdownMenuSeparator />
@@ -228,7 +315,4 @@ export const SideBySide: Story = {};
 
 export const Menu: Story = {
 	render: () => <MenuParity />,
-	play: async ({ canvasElement }) => {
-		await openMenu(canvasElement, "Menu");
-	},
 };
diff --git a/packages/ui/storybook/Tree.demo.tsx b/packages/ui/storybook/Tree.demo.tsx
new file mode 100644
index 0000000000..b85c426fe2
--- /dev/null
+++ b/packages/ui/storybook/Tree.demo.tsx
@@ -0,0 +1,58 @@
+import { useState } from "react";
+
+import { Tree, type TreeProps } from "../src/components/Tree/Tree";
+
+import type { TreeNode } from "../src/components/Tree/treeModel";
+
+const NO_IDS: readonly string[] = [];
+
+/** Every branch id, so a demo tree starts fully open unless told otherwise. */
+function branchIds(nodes: readonly TreeNode[]): readonly string[] {
+	return nodes.flatMap((node) =>
+		node.children ? [node.id, ...branchIds(node.children)] : [],
+	);
+}
+
+type DistributiveOmit<T, K extends PropertyKey> = T extends unknown
+	? Omit<T, Extract<keyof T, K>>
+	: never;
+
+export type TreeDemoProps = DistributiveOmit<
+	TreeProps,
+	"onSelectedItemChange" | "onSelectedItemsChange"
+>;
+
+/** Holds the selection and expansion state a controlled `Tree` expects. */
+export function TreeDemo({
+	multiSelect,
+	selectedItemId,
+	selectedItemIds,
+	expandedIds,
+	...treeProps
+}: TreeDemoProps): React.JSX.Element {
+	const [selectedId, setSelectedId] = useState(selectedItemId);
+	const [selectedIds, setSelectedIds] = useState(selectedItemIds ?? NO_IDS);
+	const [expanded, setExpanded] = useState(
+		() => expandedIds ?? branchIds(treeProps.nodes),
+	);
+	const selection = multiSelect
+		? ({
+				multiSelect: true,
+				selectedItemIds: selectedIds,
+				onSelectedItemsChange: setSelectedIds,
+			} as const)
+		: ({
+				multiSelect: false,
+				selectedItemId: selectedId,
+				onSelectedItemChange: setSelectedId,
+			} as const);
+
+	return (
+		<Tree
+			{...selection}
+			{...treeProps}
+			expandedIds={expanded}
+			onExpandedIdsChange={setExpanded}
+		/>
+	);
+}
diff --git a/packages/ui/tsconfig.json b/packages/ui/tsconfig.json
index de3f039b95..d8416421b9 100644
--- a/packages/ui/tsconfig.json
+++ b/packages/ui/tsconfig.json
@@ -3,5 +3,5 @@
 	"compilerOptions": {
 		"resolveJsonModule": true
 	},
-	"include": ["src", "storybook.preview.ts"]
+	"include": ["src", "storybook", "storybook.preview.ts"]
 }
diff --git a/packages/workspaces/src/App.tsx b/packages/workspaces/src/App.tsx
index abed211177..fe16f87c2d 100644
--- a/packages/workspaces/src/App.tsx
+++ b/packages/workspaces/src/App.tsx
@@ -1,3 +1,11 @@
+import { useWorkspaces } from "./hooks/useWorkspaces";
+
+/** Placeholder: renders the pushed state until the panel UI lands. */
 export default function App() {
-	return <div>TODO</div>;
+	const { state } = useWorkspaces();
+
+	if (!state) {
+		return <p>Loading workspaces...</p>;
+	}
+	return <pre>{JSON.stringify(state, null, 2)}</pre>;
 }
diff --git a/packages/workspaces/src/hooks/useWorkspaces.ts b/packages/workspaces/src/hooks/useWorkspaces.ts
new file mode 100644
index 0000000000..86efb089ef
--- /dev/null
+++ b/packages/workspaces/src/hooks/useWorkspaces.ts
@@ -0,0 +1,24 @@
+import {
+	buildApiHook,
+	WorkspacesApi,
+	type WorkspacesState,
+} from "@repo/shared";
+import { useIpc } from "@repo/webview-shared/react";
+import { useEffect, useState } from "react";
+
+/**
+ * The state the extension pushes, and the commands to send back. The state is
+ * undefined until the extension answers `ready`.
+ */
+export function useWorkspaces() {
+	const api = buildApiHook(WorkspacesApi, useIpc());
+	const [state, setState] = useState<WorkspacesState | undefined>();
+
+	useEffect(() => {
+		const unsubscribe = api.onStateChanged(setState);
+		api.ready();
+		return unsubscribe;
+	}, []);
+
+	return { state, api };
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6cf91b0392..4f37a02c0d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1,3 +1,104 @@
+---
+lockfileVersion: '9.0'
+
+importers:
+
+  .:
+    configDependencies: {}
+    packageManagerDependencies:
+      pnpm:
+        specifier: 12.3.4
+        version: 12.3.4
+
+packages:
+
+  '@pnpm/exe.darwin-arm64@12.3.4':
+    resolution: {integrity: sha512-PAyUol8T1+/+ViOiXAt51ECA+QnfXCqz6foL4bW+LsoX0NcVd5XVEM2mRQu+LV4oc7uRz9zf9U0P+XFfuQeDAw==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@pnpm/exe.darwin-x64@12.3.4':
+    resolution: {integrity: sha512-fxP9JCk0Cdye+ePuj+GJJLMUMTqHGWRdb1dtv4How876uQ2ehxvenpgiYAir/ceO9PsYUZkFTtyZdx+rRu5QOA==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@pnpm/exe.linux-arm64-musl@12.3.4':
+    resolution: {integrity: sha512-FBOt0/7ye6O6q4AllVV5QMviB6qE6fqkeczV/+MDWQsmo+QJrlfsh6X7CpH/tClVpBZEyIbjpUoT8bNhCYBxEg==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@pnpm/exe.linux-arm64@12.3.4':
+    resolution: {integrity: sha512-t71AVA7LRqiKTyZ5xMYaZc2n5DfdpMbfokZuiIOXHBOM03ECnF0t4iYwaBDqJgVjlKYUOwaF/bRQajGNA4cJ4w==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@pnpm/exe.linux-x64-musl@12.3.4':
+    resolution: {integrity: sha512-RPmk7Jb/aYaFvL2iyDN/AtMY+hUEsue732WmXpcuQ9tBpMnGyA5py7Z3+e+qmQaJ0zY/4ni9jJiyPBQHujmv6w==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@pnpm/exe.linux-x64@12.3.4':
+    resolution: {integrity: sha512-2ZqOlSPkfwX1h5cR+FPiWf8+F+2hZT/3TvhUK5sigHqwaQCIiq8R7CGxhndKs63JtcLi2a1Qpo+wX/EoyfjyJQ==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@pnpm/exe.win32-arm64@12.3.4':
+    resolution: {integrity: sha512-ANyrHqyqco6SXBysUTRF74itDyyraea7IbFsKFdNXTjcFnfycTDx37EwuhdpPYFNSIh2JhUG4fByclsRfiHX7w==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@pnpm/exe.win32-x64@12.3.4':
+    resolution: {integrity: sha512-WH/KqBPY/hq2Tb7SgQltEZytimcjgKRaCRL/aM9CI0c67iKc5TVmHUhIiL3Ux9FB4bWn36i6XewUcScQI+zG8w==}
+    cpu: [x64]
+    os: [win32]
+
+  pnpm@12.3.4:
+    resolution: {integrity: sha512-lhqkH7B32joEpEHZ+OFevAyW2o73ELLrZ7+e58sGEOq9SPH9hfUc/+c4RnhfoPh8VqOocqHYk/hEZ0G1zORUVw==}
+    engines: {node: '>=18.*'}
+    hasBin: true
+
+snapshots:
+
+  '@pnpm/exe.darwin-arm64@12.3.4':
+    optional: true
+
+  '@pnpm/exe.darwin-x64@12.3.4':
+    optional: true
+
+  '@pnpm/exe.linux-arm64-musl@12.3.4':
+    optional: true
+
+  '@pnpm/exe.linux-arm64@12.3.4':
+    optional: true
+
+  '@pnpm/exe.linux-x64-musl@12.3.4':
+    optional: true
+
+  '@pnpm/exe.linux-x64@12.3.4':
+    optional: true
+
+  '@pnpm/exe.win32-arm64@12.3.4':
+    optional: true
+
+  '@pnpm/exe.win32-x64@12.3.4':
+    optional: true
+
+  pnpm@12.3.4:
+    optionalDependencies:
+      '@pnpm/exe.darwin-arm64': 12.3.4
+      '@pnpm/exe.darwin-x64': 12.3.4
+      '@pnpm/exe.linux-arm64': 12.3.4
+      '@pnpm/exe.linux-arm64-musl': 12.3.4
+      '@pnpm/exe.linux-x64': 12.3.4
+      '@pnpm/exe.linux-x64-musl': 12.3.4
+      '@pnpm/exe.win32-arm64': 12.3.4
+      '@pnpm/exe.win32-x64': 12.3.4
+
+---
 lockfileVersion: '9.0'
 
 settings:
@@ -11,29 +112,32 @@ catalogs:
       specifier: ^0.2.3
       version: 0.2.3
     '@storybook/addon-a11y':
-      specifier: ^10.5.10
-      version: 10.5.10
+      specifier: ^10.6.0
+      version: 10.6.0
     '@storybook/addon-docs':
-      specifier: ^10.5.10
-      version: 10.5.10
+      specifier: ^10.6.0
+      version: 10.6.0
     '@storybook/react-vite':
-      specifier: ^10.5.10
-      version: 10.5.10
+      specifier: ^10.6.0
+      version: 10.6.0
     '@tanstack/react-query':
-      specifier: ^5.102.2
-      version: 5.102.2
+      specifier: ^5.102.8
+      version: 5.102.8
+    '@testing-library/user-event':
+      specifier: ^14.6.7
+      version: 14.6.7
     '@types/react':
       specifier: ^19.2.18
       version: 19.2.18
     '@types/react-dom':
-      specifier: ^19.2.5
-      version: 19.2.5
+      specifier: ^19.2.7
+      version: 19.2.7
     '@types/vscode-webview':
       specifier: ^1.57.5
       version: 1.57.5
     '@vitejs/plugin-react':
-      specifier: ^6.1.0
-      version: 6.1.0
+      specifier: ^6.1.1
+      version: 6.1.1
     '@vscode-elements/react-elements':
       specifier: ^2.4.0
       version: 2.4.0
@@ -45,7 +149,7 @@ catalogs:
       version: 1.0.0
     coder:
       specifier: github:coder/coder#9548f239a8bdfe74d0f62eafc41c97b2d7adca91
-      version: 0.0.0
+      version: https://codeload.github.com/coder/coder/tar.gz/9548f239a8bdfe74d0f62eafc41c97b2d7adca91
     date-fns:
       specifier: ^4.4.0
       version: 4.4.0
@@ -56,8 +160,11 @@ catalogs:
       specifier: ^19.2.8
       version: 19.2.8
     storybook:
-      specifier: ^10.5.10
-      version: 10.5.10
+      specifier: ^10.6.0
+      version: 10.6.0
+    storybook-addon-pseudo-states:
+      specifier: ^10.6.0
+      version: 10.6.0
     typescript:
       specifier: ^6.0.3
       version: 6.0.3
@@ -80,8 +187,8 @@ importers:
         specifier: ^1.9.1
         version: 1.9.1
       '@opentelemetry/api-logs':
-        specifier: ^0.221.0
-        version: 0.221.0
+        specifier: ^0.222.0
+        version: 0.222.0
       '@peculiar/x509':
         specifier: ^2.0.0
         version: 2.0.0
@@ -89,8 +196,8 @@ importers:
         specifier: workspace:*
         version: link:packages/shared
       axios:
-        specifier: ^1.19.0
-        version: 1.19.0(debug@4.4.3)(supports-color@8.1.1)
+        specifier: ^1.20.0
+        version: 1.20.0(debug@4.4.3)(supports-color@8.1.1)
       date-fns:
         specifier: 'catalog:'
         version: 4.4.0
@@ -110,8 +217,8 @@ importers:
         specifier: ^6.3.1
         version: 6.3.1
       pretty-bytes:
-        specifier: ^7.1.1
-        version: 7.1.1
+        specifier: ^7.1.3
+        version: 7.1.3
       proper-lockfile:
         specifier: ^4.1.2
         version: 4.1.2
@@ -131,18 +238,18 @@ importers:
         specifier: ^8.21.3
         version: 8.21.3(bufferutil@4.1.0)(utf-8-validate@6.0.6)
       zod:
-        specifier: ^4.4.3
-        version: 4.4.3
+        specifier: ^4.5.4
+        version: 4.5.4
     devDependencies:
       '@coder/pixel-storybook':
         specifier: ^0.3.0
-        version: 0.3.0(playwright-core@1.62.1)(storybook@10.5.10)
+        version: 0.3.0(playwright-core@1.62.1)(storybook@10.6.0)
       '@eslint-react/eslint-plugin':
-        specifier: ^5.18.6
-        version: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+        specifier: ^5.18.7
+        version: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       '@eslint/js':
         specifier: ^10.0.1
-        version: 10.0.1(eslint@10.9.0)
+        version: 10.0.1(eslint@10.10.0)
       '@eslint/markdown':
         specifier: ^8.0.3
         version: 8.0.3(supports-color@8.1.1)
@@ -154,22 +261,25 @@ importers:
         version: 0.2.3(@babel/core@7.29.7)(@babel/runtime@7.29.7)(rolldown@1.2.5)(vite@8.2.2)
       '@storybook/addon-a11y':
         specifier: 'catalog:'
-        version: 10.5.10(storybook@10.5.10)
+        version: 10.6.0(storybook@10.6.0)
       '@storybook/addon-docs':
         specifier: 'catalog:'
-        version: 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)
+        version: 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(storybook@10.6.0)
       '@storybook/react-vite':
         specifier: 'catalog:'
-        version: 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@8.1.1)(typescript@6.0.3)(vite@8.2.2)
+        version: 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@8.1.1)(typescript@6.0.3)(vite@8.2.2)
       '@tanstack/react-query':
         specifier: 'catalog:'
-        version: 5.102.2(react@19.2.8)
+        version: 5.102.8(react@19.2.8)
       '@testing-library/jest-dom':
         specifier: ^7.0.1
         version: 7.0.1(@testing-library/dom@10.4.1)(vitest@4.1.11)
       '@testing-library/react':
-        specifier: ^16.3.2
-        version: 16.3.2(@testing-library/dom@10.4.1)(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+        specifier: ^16.3.3
+        version: 16.3.3(@testing-library/dom@10.4.1)(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@testing-library/user-event':
+        specifier: 'catalog:'
+        version: 14.6.7(@testing-library/dom@10.4.1)
       '@tsconfig/node22':
         specifier: ^22.0.6
         version: 22.0.6
@@ -187,7 +297,7 @@ importers:
         version: 19.2.18
       '@types/react-dom':
         specifier: 'catalog:'
-        version: 19.2.5(@types/react@19.2.18)
+        version: 19.2.7(@types/react@19.2.18)
       '@types/semver':
         specifier: ^7.8.0
         version: 7.8.0
@@ -204,14 +314,14 @@ importers:
         specifier: ^8.18.1
         version: 8.18.1
       '@typescript-eslint/eslint-plugin':
-        specifier: ^8.67.0
-        version: 8.67.0(@typescript-eslint/parser@8.67.0)(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+        specifier: ^8.69.0
+        version: 8.70.0(@typescript-eslint/parser@8.70.0)(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       '@typescript-eslint/parser':
-        specifier: ^8.67.0
-        version: 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+        specifier: ^8.69.0
+        version: 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       '@vitejs/plugin-react':
         specifier: 'catalog:'
-        version: 6.1.0(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)
+        version: 6.1.1(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)
       '@vitest/coverage-v8':
         specifier: ^4.1.11
         version: 4.1.11(vitest@4.1.11)
@@ -252,29 +362,29 @@ importers:
         specifier: ^0.28.2
         version: 0.28.2
       eslint:
-        specifier: ^10.9.0
-        version: 10.9.0(supports-color@8.1.1)
+        specifier: ^10.9.1
+        version: 10.10.0(supports-color@8.1.1)
       eslint-config-prettier:
         specifier: ^10.1.8
-        version: 10.1.8(eslint@10.9.0)
+        version: 10.1.8(eslint@10.10.0)
       eslint-import-resolver-typescript:
         specifier: ^4.4.5
-        version: 4.4.5(eslint-plugin-import-x@4.17.1)(eslint@10.9.0)(supports-color@8.1.1)
+        version: 4.4.5(eslint-plugin-import-x@4.17.1)(eslint@10.10.0)(supports-color@8.1.1)
       eslint-plugin-import-x:
         specifier: ^4.17.1
-        version: 4.17.1(@typescript-eslint/utils@8.67.0)(eslint@10.9.0)(supports-color@8.1.1)
+        version: 4.17.1(@typescript-eslint/utils@8.70.0)(eslint@10.10.0)(supports-color@8.1.1)
       eslint-plugin-package-json:
-        specifier: ^1.7.1
-        version: 1.7.1(eslint@10.9.0)
+        specifier: ^1.8.0
+        version: 1.8.0(eslint@10.10.0)
       eslint-plugin-react-hooks:
         specifier: ^7.1.1
-        version: 7.1.1(eslint@10.9.0)(supports-color@8.1.1)
+        version: 7.1.1(eslint@10.10.0)(supports-color@8.1.1)
       eslint-plugin-storybook:
-        specifier: ^10.5.10
-        version: 10.5.10(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+        specifier: ^10.6.0
+        version: 10.6.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       globals:
-        specifier: ^17.11.0
-        version: 17.11.0
+        specifier: ^17.12.0
+        version: 17.12.0
       jsdom:
         specifier: ^30.0.1
         version: 30.0.1
@@ -282,8 +392,8 @@ importers:
         specifier: ^3.3.0
         version: 3.3.0
       memfs:
-        specifier: ^4.68.1
-        version: 4.68.1
+        specifier: ^4.69.1
+        version: 4.71.0
       playwright-core:
         specifier: ^1.62.1
         version: 1.62.1
@@ -298,13 +408,16 @@ importers:
         version: 19.2.8(react@19.2.8)
       storybook:
         specifier: 'catalog:'
-        version: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+        version: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook-addon-pseudo-states:
+        specifier: 'catalog:'
+        version: 10.6.0(storybook@10.6.0)
       typescript:
         specifier: 'catalog:'
         version: 6.0.3
       typescript-eslint:
-        specifier: ^8.67.0
-        version: 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+        specifier: ^8.69.0
+        version: 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       utf-8-validate:
         specifier: ^6.0.6
         version: 6.0.6
@@ -373,14 +486,14 @@ importers:
     dependencies:
       '@tanstack/react-query':
         specifier: 'catalog:'
-        version: 5.102.2(react@19.2.8)
+        version: 5.102.8(react@19.2.8)
       react:
         specifier: 'catalog:'
         version: 19.2.8
     devDependencies:
       '@storybook/react-vite':
         specifier: 'catalog:'
-        version: 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.2)
+        version: 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.2)
       typescript:
         specifier: 'catalog:'
         version: 6.0.3
@@ -395,7 +508,7 @@ importers:
         version: link:../webview-shared
       '@tanstack/react-query':
         specifier: 'catalog:'
-        version: 5.102.2(react@19.2.8)
+        version: 5.102.8(react@19.2.8)
       '@vscode-elements/react-elements':
         specifier: 'catalog:'
         version: 2.4.0(@types/react@19.2.18)(@vscode/codicons@0.0.46-24)(react-dom@19.2.8)(react@19.2.8)
@@ -426,10 +539,10 @@ importers:
         version: 19.2.18
       '@types/react-dom':
         specifier: 'catalog:'
-        version: 19.2.5(@types/react@19.2.18)
+        version: 19.2.7(@types/react@19.2.18)
       '@vitejs/plugin-react':
         specifier: 'catalog:'
-        version: 6.1.0(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)
+        version: 6.1.1(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)
       babel-plugin-react-compiler:
         specifier: 'catalog:'
         version: 1.0.0
@@ -444,20 +557,26 @@ importers:
     dependencies:
       '@radix-ui/react-context-menu':
         specifier: ^2.3.7
-        version: 2.3.7(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+        version: 2.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-dropdown-menu':
         specifier: ^2.1.24
-        version: 2.1.24(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+        version: 2.1.24(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-select':
+        specifier: ^2.3.7
+        version: 2.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-slot':
+        specifier: ^1.3.3
+        version: 1.3.3(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-tooltip':
         specifier: ^1.2.16
-        version: 1.2.16(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+        version: 1.2.16(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@vscode/codicons':
         specifier: 'catalog:'
         version: 0.0.46-24
     devDependencies:
       '@storybook/react-vite':
         specifier: 'catalog:'
-        version: 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.2)
+        version: 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.2)
       '@types/react':
         specifier: 'catalog:'
         version: 19.2.18
@@ -472,7 +591,7 @@ importers:
         version: 19.2.8(react@19.2.8)
       storybook:
         specifier: 'catalog:'
-        version: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+        version: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
       typescript:
         specifier: 'catalog:'
         version: 6.0.3
@@ -512,7 +631,7 @@ importers:
         version: link:../webview-shared
       '@tanstack/react-query':
         specifier: 'catalog:'
-        version: 5.102.2(react@19.2.8)
+        version: 5.102.8(react@19.2.8)
       '@vscode-elements/react-elements':
         specifier: 'catalog:'
         version: 2.4.0(@types/react@19.2.18)(@vscode/codicons@0.0.46-24)(react-dom@19.2.8)(react@19.2.8)
@@ -543,10 +662,10 @@ importers:
         version: 19.2.18
       '@types/react-dom':
         specifier: 'catalog:'
-        version: 19.2.5(@types/react@19.2.18)
+        version: 19.2.7(@types/react@19.2.18)
       '@vitejs/plugin-react':
         specifier: 'catalog:'
-        version: 6.1.0(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)
+        version: 6.1.1(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)
       babel-plugin-react-compiler:
         specifier: 'catalog:'
         version: 1.0.0
@@ -709,6 +828,12 @@ packages:
     resolution: {integrity: sha512-ctxtJ/eA+t+6q2++vj5j7FYX3nRu311q1wfYH3xjlLOsczhlhxAg2FWNUXhpGvAw3BWo1xBcvOV6/YLc2r5FJw==}
     hasBin: true
 
+  '@cacheable/memory@2.2.0':
+    resolution: {integrity: sha512-CTLKqLItRCEixEAewD3/j9DB3/o96gpTPD4eJ1v+DGOlxZRZncRQkGYqqnAGCscYd6RNeXfGeiuCphsPtqyIfQ==}
+
+  '@cacheable/utils@2.5.0':
+    resolution: {integrity: sha512-buipgOVDkkPXNR5+xBpDw7Zk2n1EvU7qBJCNUcL7rhQ//kfpOXPAvQ511Os0vpLYJ1pZnvudNytkQt2hst3wqA==}
+
   '@coder/coder@https://codeload.github.com/coder/coder/tar.gz/9548f239a8bdfe74d0f62eafc41c97b2d7adca91':
     resolution: {gitHosted: true, integrity: sha512-kTNAwjDEjoiXqBjhgHFQWHll4aFGnqjaLUlzA+xwZjN1vLgQjTEoCzrhImyRgAV1EkxmW5aFmfLkkBgm8D7+6A==, tarball: https://codeload.github.com/coder/coder/tar.gz/9548f239a8bdfe74d0f62eafc41c97b2d7adca91}
     version: 0.0.0
@@ -958,50 +1083,50 @@ packages:
     resolution: {integrity: sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==}
     engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
 
-  '@eslint-react/ast@5.18.6':
-    resolution: {integrity: sha512-okgOez6L9onvcdU0lyLOykKQSaj2hMtVV2ucx2iqmTsfKDGyhVlMuNLnfyOkgQyHdgfROTVtAAYnQ6KPf7PggQ==}
+  '@eslint-react/ast@5.19.0':
+    resolution: {integrity: sha512-6d9UY/CVz+zGMi6+aext7HSOVAj2Fa9eL7okBRnjBeMrRhmRAqtbm1oK7J+VlWrmUNLsiNXpyklhq36BsmYddg==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  '@eslint-react/core@5.18.6':
-    resolution: {integrity: sha512-utvjmfgy/lMSMt4QSU5QK2coHk6tkRChxLmkW6z8sthgmB6138CYzC3cPR9kze5pOgYJouF95xiaPnHKnXx21A==}
+  '@eslint-react/core@5.19.0':
+    resolution: {integrity: sha512-PFhetWfvG6ZhLiJomkzjKKCLu6DVbKdyeYZ7HE7/rvAvmfsNi9iCGBqxkgXWfWpWEf24KrRUVpS3wLGJpPL8+g==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  '@eslint-react/eslint-plugin@5.18.6':
-    resolution: {integrity: sha512-qBZXKx05CPNrvdNydM958rZt2hgVhhriU/8LUeS5s/5gdpuekflrfF+y3yT4NT8Ej3J37h7e50RdH6Lu1r0KPg==}
+  '@eslint-react/eslint-plugin@5.19.0':
+    resolution: {integrity: sha512-SA3+Iz87sH3pq8hFHb+QhYrOpOyzut+k9YCx2WCJsapK3fu7odk73GRXB6J/W5f8tz0J0ARj1r+DsaSdGtF/zw==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  '@eslint-react/eslint@5.18.6':
-    resolution: {integrity: sha512-8BzLB6mtIDmAIwAt1u4g6Yp+1LSGAnqm8SGNHbyZG1sQikWW9Fskv3fx5Zy6CGMV9D7gafcHTiVTcuBYNE+87w==}
+  '@eslint-react/eslint@5.19.0':
+    resolution: {integrity: sha512-wod1Yd/atJbUD36naGirzztZ9w4BAWSxwIxF8/6qT7PaN/Q9r/vTB/T5rmmgvMa3C/hp0yI3uqr4zbO2mRPBOQ==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  '@eslint-react/jsx@5.18.6':
-    resolution: {integrity: sha512-oAbG2pW6XhiROZotfSjLU19A84/AxYHiiKjim5USHH5xtYfYjO7skFSM6LztuPggqn/wccSxLgmKIFGUKM/95g==}
+  '@eslint-react/jsx@5.19.0':
+    resolution: {integrity: sha512-iqauNb+qeNaEbG7VfDj+8taRLJFbEkptzdPx+YnIbyxhCVAnMaB3s/yeVyi4nszja7YwE/FccFInPZ4Qv8fVZw==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  '@eslint-react/shared@5.18.6':
-    resolution: {integrity: sha512-zCzb/W1xwG412BWVTjqhDznsJEHdyZVkVJz4jbAebHLpKxygK5XeG+vShdYbIFC7OcJU8hYbvEf3P2UNqXVhBw==}
+  '@eslint-react/shared@5.19.0':
+    resolution: {integrity: sha512-4x56YzT3Gph725Z8x1vMbOYUkOpbqp2v9NuFb9F7GqVmyZq9OxAQPEj5b7o+Fd2C1VIC3mHNCfL3FHVZ1YH8mA==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  '@eslint-react/var@5.18.6':
-    resolution: {integrity: sha512-5pxFlOy0Ajx+JUz4I4PwnYtOrqcj/R59Gx9m/WWjukFza/ap3FYnu8vEl2Q0txUQoUPJ7euPnBhkKOE7LhsOWA==}
+  '@eslint-react/var@5.19.0':
+    resolution: {integrity: sha512-dRRM/AYqQli1VNijY7n0+q4zUlNCGiOY1wGr1r+c5ajvlv/XwGibhTJjY6zGZWIjL9TUMIbIEH8aOdRaw2iNQg==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
@@ -1040,6 +1165,10 @@ packages:
     resolution: {integrity: sha512-+CNAzxglkrpNf/kKywqQfk74QjtceuOE7Qm+AF8miRvPF/wmmK5+OJOgVh3AVTT3RP2mH3+FOaxlE5v72owk0A==}
     engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
+  '@eslint/plugin-kit@0.7.3':
+    resolution: {integrity: sha512-IkO+/KEUvwbVpiURZg+P7zF74z5Jxe0UgJxVni+RtoHQ6IZieXaO02kmadomap/q+l6bc/jdPGGqTjhuZnuz1Q==}
+    engines: {node: ^20.19.0 || ^22.13.0 || >=24}
+
   '@exodus/bytes@1.15.1':
     resolution: {integrity: sha512-S6mL0yNB/Abt9Ei4tq8gDhcczc4S3+vQ4ra7vxnAf+YHC02srtqxKKZghx2Dq6p0e66THKwR6r8N6P95wEty7Q==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0}
@@ -1153,50 +1282,50 @@ packages:
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-core@4.68.1':
-    resolution: {integrity: sha512-V5oZ4Gt9WJKyQef0n9cAd0N9qjSkIBm3E4MYsgNIWBk5aINCDPKxMPo1i29rBxqiT4Ixf1epklqV9VJMKIxwlw==}
+  '@jsonjoy.com/fs-core@4.71.0':
+    resolution: {integrity: sha512-9DFR/j+bm+tig1abs1CWS1/r0IVjNUdTp/+q6R/PXayXpO1rgbUh7tkanGYP40I0zdxbOreN3tmzBpVHgfMKzg==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-fsa@4.68.1':
-    resolution: {integrity: sha512-HCG72UioncuO7Gw09XNVG+S85e3cq2hrUC/mexBrsWsa3mI7eePkkqWie3uVYbtsb64OR9YGQs5SqaufDRYBcg==}
+  '@jsonjoy.com/fs-fsa@4.71.0':
+    resolution: {integrity: sha512-dRw5ojxzep3lntVGVBLzQUMYj1hXLH+DAz9sK0vKU+594x/zA2nYPOiitlyhYtOJ2nv1FXNq7c55rgwANknIWw==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-node-builtins@4.68.1':
-    resolution: {integrity: sha512-HK1BTksysokNZxNspqDH0yPaqN9YgR/AYIlYiIaU2Ys4BOk5CdybI7r6BgiZuiiPiV8n4sK/kZdice7Znpy2Kw==}
+  '@jsonjoy.com/fs-node-builtins@4.71.0':
+    resolution: {integrity: sha512-BSzl+QFSxZF58BxGjV1wqCJ+qSn3b2IZnb+z3hDQq6goqOO5RuxF8gRihjsFx17AfpEpa7XjYcP8XpQtDU8RrQ==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-node-to-fsa@4.68.1':
-    resolution: {integrity: sha512-lpKmU4X9e/oh8GIuAI7EXaS5QiLNM3KD15CkdhfS6PYmrGvoJqKQcyEfnLgnnaGslh/PFUMYSIZBCf2ejJGw8g==}
+  '@jsonjoy.com/fs-node-to-fsa@4.71.0':
+    resolution: {integrity: sha512-OlXBZKIeDx5bIGcQmn0w+nVkLheCiuQSepKiBAiWSWimSdn8Q6Yc9ih2y8zStcJk31fieqnov9V+o8XTWn/5Rw==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-node-utils@4.68.1':
-    resolution: {integrity: sha512-/GxfW1DWm9SCdkfbvqevLO/P5duobQfmKkHXxdMIDbcZMQeAgooAstIfZhkXpATzq9QbCQsnoWFM/dGHdZfndw==}
+  '@jsonjoy.com/fs-node-utils@4.71.0':
+    resolution: {integrity: sha512-YtzCL3jbKYx6LHxqS9ymJ9Ob7SO9cucI+kpNO3LijGNFEjFbvNsTlHkvFgocAMAjUk96TpQTCsYkzFQi1CdlAA==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-node@4.68.1':
-    resolution: {integrity: sha512-R5D9mWtqdURzcOWj1vdXr3APCwX0xchtFT+kmW7fXLNDifWdDrnh26jSID8pdnUfFBxTyfHtFtTL/NWKzIH7kQ==}
+  '@jsonjoy.com/fs-node@4.71.0':
+    resolution: {integrity: sha512-yt5Ak0otPdHPIlmMvF16aLG2qSZL52EYJ7HOkYpBcIPWw+kmT1FtTSj4oiV2OUkJbG8pLzA+RhMgrlRl85QuBw==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-print@4.68.1':
-    resolution: {integrity: sha512-oGeZOGPYKK9v1CgeVeEDsLomH1lCnslSpqUN5GmPzrmAVGQlsmsdcXNA2O4lV8Y4xkuSuynx2ITBkUHJVaTbow==}
+  '@jsonjoy.com/fs-print@4.71.0':
+    resolution: {integrity: sha512-OhfDSdvyO8uGV0U11OP+mOeVCPgjuP1HqCGR/TdBQLxHoDEWJAK3KOP5fPXo57H7i3G0x0Vmv8xPRHDle4XGzA==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
 
-  '@jsonjoy.com/fs-snapshot@4.68.1':
-    resolution: {integrity: sha512-XZfP0FDZN32bbc4t2bZN2qRrYHg5AktJnzk22HRoKGK4BprrbNRH2k5ceSNS/kupKYcofCs+O841+xaAbjnxwQ==}
+  '@jsonjoy.com/fs-snapshot@4.71.0':
+    resolution: {integrity: sha512-md+Wov365xa9A3nfW9YQTHLcweHHAee/e/0UoVRbldEHxboPJknuO3sEkNVVECO0dTqKra/ERaQylAMRrGWd0Q==}
     engines: {node: '>=10.0'}
     peerDependencies:
       tslib: '2'
@@ -1237,6 +1366,15 @@ packages:
     peerDependencies:
       tslib: '2'
 
+  '@keyv/bigmap@1.3.1':
+    resolution: {integrity: sha512-WbzE9sdmQtKy8vrNPa9BRnwZh5UF4s1KTmSK0KUVLo3eff5BlQNNWDnFOouNpKfPKDnms9xynJjsMYjMaT/aFQ==}
+    engines: {node: '>= 18'}
+    peerDependencies:
+      keyv: ^5.6.0
+
+  '@keyv/serialize@1.1.1':
+    resolution: {integrity: sha512-dXn3FZhPv0US+7dtJsIi2R+c7qWYiReoEh5zUntWCf4oSpMNib8FDhSoed6m3QyZdx5hK7iLFkYk3rNxwt8vTA==}
+
   '@lit-labs/ssr-dom-shim@1.6.0':
     resolution: {integrity: sha512-VHb0ALPMTlgKjM6yIxxoQNnpKyUKLD04VzeQdsiXkMqkvYlAHxq9glGLmgbb889/1GsohSOAjvQYoiBppXFqrQ==}
 
@@ -1276,8 +1414,8 @@ packages:
     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
     engines: {node: '>= 8'}
 
-  '@opentelemetry/api-logs@0.221.0':
-    resolution: {integrity: sha512-OlanaW1vv7ufTqQ3/fPLI4arGt5ZoM+P8abOMki6uEYnpRazepSWDwDnnw+la7kE26SHVC18//SMccrDvLKOXQ==}
+  '@opentelemetry/api-logs@0.222.0':
+    resolution: {integrity: sha512-9mb1If+IF6u0ZVXkHQ6ogEae5HwA6ajIVUgpSDQyRASxft6BSXHvBvPooRle3yFN/fKnCdSOnuu0OC3PLcF6+g==}
     engines: {node: '>=8.0.0'}
 
   '@opentelemetry/api@1.9.1':
@@ -1571,6 +1709,9 @@ packages:
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
 
+  '@radix-ui/number@1.1.3':
+    resolution: {integrity: sha512-Road2bidD0uu/1BGDOWNdPI06g0lIRy6IF9GZcIrDK2KGItfor8IQwQa+yM2ERgHM1MmHxaxpTzk0/Jp42lNfA==}
+
   '@radix-ui/primitive@1.1.7':
     resolution: {integrity: sha512-rqWnm76nYT8HoNNqEjpgJ7Pw/DrBj5iBTrmEPo6HTX5+VJyBNOqTdv4g89G63HuR5g0AaENoAcH7Is5fF2kZ8Q==}
 
@@ -1775,6 +1916,19 @@ packages:
       '@types/react-dom':
         optional: true
 
+  '@radix-ui/react-select@2.3.7':
+    resolution: {integrity: sha512-WFGImkmbzcfxeIwq/+4HvRN0pizBwbwQUED4I13ezQsDdfl38ZntN6TmR8XaSzPBqoCToe8rF75j6NPNDSzhbg==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
   '@radix-ui/react-slot@1.3.3':
     resolution: {integrity: sha512-qx7oqnYbxnK9kYI9m317qmFmEgo6ywqWvbTogdj7cL9p3/yx4M48p7Rnw5z3H890cL/ow/EeWJsuTykeZVXP5Q==}
     peerDependencies:
@@ -1842,6 +1996,15 @@ packages:
       '@types/react':
         optional: true
 
+  '@radix-ui/react-use-previous@1.1.4':
+    resolution: {integrity: sha512-XoSLhbRbqxFtgJoi2fNHA3C6pDlY34x508vUpUGoFZfvePfHXHbE1lC4FYFMnJWgiCRroSTw6fOsXQoVS9RwZg==}
+    peerDependencies:
+      '@types/react': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+
   '@radix-ui/react-use-rect@1.1.4':
     resolution: {integrity: sha512-cSOCh6JlkmfjLyNcLiu2nB4v+nm+dkZ+Q5KHWk/soo4U7ZLiEQFKHK9/YmtBHjfCEaU43IBKQOc4/uJmCaiCTQ==}
     peerDependencies:
@@ -2053,44 +2216,26 @@ packages:
   '@standard-schema/spec@1.1.0':
     resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
 
-  '@storybook/addon-a11y@10.5.10':
-    resolution: {integrity: sha512-RpRQV5xUbrl6hCiNrd5FSMIo6pnRZ0VZxWvEW/ASLcreGkKUW5jl2AeLCe5YROE2i80s/dU+6VPzOYKrwWNFbQ==}
+  '@storybook/addon-a11y@10.6.0':
+    resolution: {integrity: sha512-Z/CZor/F8H74/+IoeLroEQXQoVxvmjVtUgATJ95KPBolHxMaHLXLsYU0wosIiiORxmfRCnpen5pQl1n4+pBWQw==}
     peerDependencies:
-      storybook: ^10.5.10
+      storybook: ^10.6.0
 
-  '@storybook/addon-docs@10.5.10':
-    resolution: {integrity: sha512-06JoK3/a7FWI/6GzuidJP9iHp1/Vejboe6lzS1jW+d8ItpecriBt+oXh1VNmUM7i7PjI6pZnet+j51QnLyeOoQ==}
+  '@storybook/addon-docs@10.6.0':
+    resolution: {integrity: sha512-Fk3rUQWeGyCfL170OkmRp6Ruyv7MHPb/xrKa6YNk7FlGmlVLi5tKzh2T/0J13vWEy8wiu2MV3IBu8iRsaUR+Cw==}
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.5.10
+      storybook: ^10.6.0
     peerDependenciesMeta:
       '@types/react':
         optional: true
 
-  '@storybook/builder-vite@10.5.10':
-    resolution: {integrity: sha512-O4GgIP0tKLRueom3EmU3OaBUHKjNYj+jkOvmTIkn3PYTiWVkCuHqSKEs4ADvRyaQuLH+peHhFe4JtkNC9KbtrQ==}
+  '@storybook/builder-vite@10.6.0':
+    resolution: {integrity: sha512-7zt8tYB6dnSO8fbjUz91MHexGDpf9HrLlA3FAmlVb+2ZL3eWUs499L3I6BDUymcWu7oW5WCBJlB8ERj8ZLLzig==}
     peerDependencies:
-      storybook: ^10.5.10
+      storybook: ^10.6.0
       vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
 
-  '@storybook/csf-plugin@10.5.10':
-    resolution: {integrity: sha512-TaCLBrqVEr767+w58QDotDUiCTuE5cyRJuRcDlsKQyUIyGBv+lYD3lu8wBiVCYxgIjB/gu9HmqiC+0yx1rHzaw==}
-    peerDependencies:
-      esbuild: '*'
-      rollup: '*'
-      storybook: ^10.5.10
-      vite: '*'
-      webpack: '*'
-    peerDependenciesMeta:
-      esbuild:
-        optional: true
-      rollup:
-        optional: true
-      vite:
-        optional: true
-      webpack:
-        optional: true
-
   '@storybook/global@5.0.0':
     resolution: {integrity: sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ==}
 
@@ -2099,40 +2244,40 @@ packages:
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
 
-  '@storybook/react-dom-shim@10.5.10':
-    resolution: {integrity: sha512-rbu62ILo/VE3iXKmu+kWXFpD1H1Lwi0f19q/x7JnDsD2dxKS9w5znLEqPIq2qxpzi/wjjIb2iUP1cRG1d/9W5A==}
+  '@storybook/react-dom-shim@10.6.0':
+    resolution: {integrity: sha512-ZE0l4xL6d00rKFeJhRDuh0t3r+/2ffhx47lIyaSWrTD5kuM3nDjKDxCIWwX4E3gLV+oNX8E1prXRMuEWJUJwJg==}
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       '@types/react-dom': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.5.10
+      storybook: ^10.6.0
     peerDependenciesMeta:
       '@types/react':
         optional: true
       '@types/react-dom':
         optional: true
 
-  '@storybook/react-vite@10.5.10':
-    resolution: {integrity: sha512-xOztxefUnqKeuyvcnjspqmlDnER4cExL+liltrpdXLPJVqfFNr9lgM49FyEPajzsUVG9W/vHJWjbaQGGu1UsYQ==}
+  '@storybook/react-vite@10.6.0':
+    resolution: {integrity: sha512-nc1dqnmjGOcDJvPCkAn4Hmu1gi7dNHHoibNmlBp0d1adosejELZxuNjHBkPl/KxZjbzP3jljQHnHB/guxd8e2g==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.5.10
+      storybook: ^10.6.0
       typescript: '>= 4.9.x'
       vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       typescript:
         optional: true
 
-  '@storybook/react@10.5.10':
-    resolution: {integrity: sha512-4MBV5e1SXIMfPynLHzr+Mp0dwGv/FW1bklWAsS4ynBOAbC98W9p/I9vqBnUctsvE3BJkhzHQQyPwMHL5tTcHVA==}
+  '@storybook/react@10.6.0':
+    resolution: {integrity: sha512-0xfYYPRHcr5ta1hmXJCSezH4JGuUHJ+xVF9f1j+Y/MWEMOQE4wnaKWKsk/HLrDjZkT5hKfvmogt9b0yduP6zEQ==}
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       '@types/react-dom': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.5.10
+      storybook: ^10.6.0
       typescript: '>= 4.9.x'
     peerDependenciesMeta:
       '@types/react':
@@ -2142,11 +2287,11 @@ packages:
       typescript:
         optional: true
 
-  '@tanstack/query-core@5.102.2':
-    resolution: {integrity: sha512-zQ5794PXBlV5Wl7N23SR1/Ss+wPE/h2Ye4XlKpm3omN8i8b/Fd4DAdqpLS2AXj5M/RMObt3k5qy3E7kzt/AvBA==}
+  '@tanstack/query-core@5.102.8':
+    resolution: {integrity: sha512-ZNjkJ33CqvPNec/6lZBnHqLc3EVGPZ9ySLhYahU9TcuRFdmwXewuj0c4hwSWcGHqEUwcSrKeZ+oGcvPBqXcQcg==}
 
-  '@tanstack/react-query@5.102.2':
-    resolution: {integrity: sha512-KxU8ZyOEuJ81eTSgXa8GQbk/jO/rz0elYtNKt3VMtM2pRjeO8ADIu7sqqmEjFKJKqco9h2N1ojIDuHs6VfDItQ==}
+  '@tanstack/react-query@5.102.8':
+    resolution: {integrity: sha512-TYBea4OuXWD7MhaSHq069TWbFe7rcwWN6kzT7JF0OKi1K6c1gTv2IzD6A6ExJsCMozdkqBWeuIUZmu4KQg0O5A==}
     peerDependencies:
       react: ^18 || ^19
 
@@ -2168,8 +2313,8 @@ packages:
       vitest:
         optional: true
 
-  '@testing-library/react@16.3.2':
-    resolution: {integrity: sha512-XU5/SytQM+ykqMnAnvB2umaJNIOsLF3PVv//1Ew4CTcpz0/BRyy/af40qqrt7SjKpDdT1saBMc42CUok5gaw+g==}
+  '@testing-library/react@16.3.3':
+    resolution: {integrity: sha512-Uo193NgQbPMz6lrrhtRQQFcMC6Re/ELLFbbuVL30WDlZxlpZf9/lMHTAVxPRLw1q1iu9OJmR1c2BLiENRstdBg==}
     engines: {node: '>=18'}
     peerDependencies:
       '@testing-library/dom': ^10.0.0
@@ -2183,8 +2328,8 @@ packages:
       '@types/react-dom':
         optional: true
 
-  '@testing-library/user-event@14.6.6':
-    resolution: {integrity: sha512-Jbs9FpkkIDw8FgSc6kOVsOv8JuuqGAL7J4X1oot77JxAoDlkNn2GRkd0aYRVuQ+pVQAiHWVkE4rX/dkF5fBiCw==}
+  '@testing-library/user-event@14.6.7':
+    resolution: {integrity: sha512-MPCpX8bxe8zS+JmmTwLp8jd0dy1rAm60Te/SL8JrQM3qvQJcBOs1d7IefJMyZzqM3EWBrDn/LWDt1BCGu4ASfg==}
     engines: {node: '>=12', npm: '>=6'}
     peerDependencies:
       '@testing-library/dom': '>=7.21.4'
@@ -2280,8 +2425,8 @@ packages:
   '@types/proper-lockfile@4.1.4':
     resolution: {integrity: sha512-uo2ABllncSqg9F1D4nugVl9v93RmjxF6LJzQLMLDdPaXCUIDPeOJ21Gbqi43xNKzBi/WQ0Q0dICqufzQbMjipQ==}
 
-  '@types/react-dom@19.2.5':
-    resolution: {integrity: sha512-fMPwH9v7r/pp43yUd2/Mbiex5KouJwwR3dzHkhLREUC6764VyDsqxhAxv6OFEYR1RhjOyD1naqba8ECDBe7ZQg==}
+  '@types/react-dom@19.2.7':
+    resolution: {integrity: sha512-I8bPpDLcHBv1qiIiXDCy71Rt8eQDKJP0sMSWJphDdAcdqiJ1sGpZamavoEIRZmYzjia9LuEb2HlYdDpmoENpvQ==}
     peerDependencies:
       '@types/react': ^19.2.0
 
@@ -2318,39 +2463,39 @@ packages:
   '@types/ws@8.18.1':
     resolution: {integrity: sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==}
 
-  '@typescript-eslint/eslint-plugin@8.67.0':
-    resolution: {integrity: sha512-Un7Heoyj65NREbKAyIrFxeM143NZpExWmy1Nep4DLeQOeLlTeumPjoNKnBrU5D5moWXbPJgRa5Uwcdu0faVNGQ==}
+  '@typescript-eslint/eslint-plugin@8.70.0':
+    resolution: {integrity: sha512-/v8HZt6RlyIZxB3ntehELOcUcfxKPVGWXnQdJuHRmzrqgF8nQypcC/oxGW+Ot4VGKDq81XugPKxx0n5PBtf9PA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      '@typescript-eslint/parser': ^8.67.0
+      '@typescript-eslint/parser': ^8.70.0
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/parser@8.67.0':
-    resolution: {integrity: sha512-fUBfTuuEulWqX6V8+O3PtScV01tzYYRUDTAirHFKoRAt7nOzoGiPt0M/bB47wWNy0coOOcgEwAMUtBpykMxl6w==}
+  '@typescript-eslint/parser@8.70.0':
+    resolution: {integrity: sha512-zYvrmj9Yxd63UGaXw+kdt6A0F0s0qveJyuatIM77bYC2DE4pgmg7a50u8LR7PRtXd0x+h+Tl3eXabGm06SWd3Q==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/project-service@8.67.0':
-    resolution: {integrity: sha512-cvE8c7ulYeXN9fYuszhCeCsbzyVEXuhrRCybnBre7TUmqb5nRmBfQAwCj0O3WJFDeyAZt4VYv51vMCC9LHSdYw==}
+  '@typescript-eslint/project-service@8.70.0':
+    resolution: {integrity: sha512-hFHbTNqhU9G+2eKFXCBVb1tjFT/LceiJ4+HfLO4pTpDI0KHi6iajpcFFkaSQ9gXmCh7n82A0PthaayEdN6mspQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/scope-manager@8.67.0':
-    resolution: {integrity: sha512-EgvsleTwS4E+WzzSvem8fAUubLwatMNF1B5hHSLQxcvs7q2dtRhGyujHwLJSYlG41niJ7GP24Aha2+0mb1b2kg==}
+  '@typescript-eslint/scope-manager@8.70.0':
+    resolution: {integrity: sha512-8nP3Kwh5hlgZ4FicGvmznAmJe8UL4sdU8tLukrPaMuQmDuk4Y8xYfzu/aYZW4xT2JCgc7H/TpDI5cGlxcWJSqQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/tsconfig-utils@8.67.0':
-    resolution: {integrity: sha512-vV+LUSv5njUWsknE71fqKTlXUva+R76SaeORd6Zojcunk/6DvKFXONU3BrAs2H49mbygUXt6gbYunzwqNwlhdg==}
+  '@typescript-eslint/tsconfig-utils@8.70.0':
+    resolution: {integrity: sha512-adnkeeNq9Sq1sUf4+FRVc0KdgYghzsgFpZSQVZVvY0LCuUuN0FnQgyGzCJeC4fW1cdXseBAjU2EOqUIjbNcZUw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/type-utils@8.67.0':
-    resolution: {integrity: sha512-aVWDXbRmdXO9siTfX4ditQI1T9+zVcNazT48EJCD0v40/9RIFoUgZ05CmGEq9H2gixRpjUn/iplwvlcvutJW/Q==}
+  '@typescript-eslint/type-utils@8.70.0':
+    resolution: {integrity: sha512-NUMKIhYVaVIVLnRL9CRt+VVcuLgSHUCpXn4/+K8wql+vdInUzvx8BjUO1oJ7cG9shjFJKtF8F8Hh2kCh3/KBVw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
@@ -2360,21 +2505,25 @@ packages:
     resolution: {integrity: sha512-sBtgslww8nsMYUjhdPBiSyUqSzT8uR6g93A2QXnQC8+cGdjz0CyaOdqHDRJb1AtORbZCNUJBBeFA/tNR2uQmww==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/typescript-estree@8.67.0':
-    resolution: {integrity: sha512-EKQBCE9yNlRJYm7jdTW5AhDacDUmSwQb0FAJAmK2EKYrNXIsa2vxcSZx6PvJ/dEdI6lS+Y9W+EXckLj0iPFGcw==}
+  '@typescript-eslint/types@8.70.0':
+    resolution: {integrity: sha512-asTOIYhDg4zdzOScCyaytrsV3cR6B4ecPQlXw/dJIm7J/MZTtCtfVII9JD8Geh4jTCrK/Xe6cg5UevoleMcoJQ==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@typescript-eslint/typescript-estree@8.70.0':
+    resolution: {integrity: sha512-d9NmHMPEKQ7QCLLm1jI3zmoQBwT5KwFYjXBJ9ymZfKCUU+5rmTRykKAFvH5Qn/ZCds3CEAFS9OC9M/jkl0X2bA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/utils@8.67.0':
-    resolution: {integrity: sha512-U9D1FdwEWBwok3hxxSdhclMb0twvt9QnjIQ0VfQ1AiX2epnpSgv2ubVDsayOFyY8K6FX+AQ7E0FKWVG3iKsj1A==}
+  '@typescript-eslint/utils@8.70.0':
+    resolution: {integrity: sha512-oZmtKJz/4fufZ2p3+Cn3ijEojcdfR+1zYDH2xKYrEly0dR/Q/1xUPRCOlKGxod78nWlU2UnDe09GZ3TaknBFGA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/visitor-keys@8.67.0':
-    resolution: {integrity: sha512-fkv8dHRDqfGtTHuJeebdrQ7cX6Ad4WAS00rgHh9UGvMycF1mjBfsxry1XsLIFhWZ6Judlh6UdzK+TYlbpCXgnA==}
+  '@typescript-eslint/visitor-keys@8.70.0':
+    resolution: {integrity: sha512-BoC8PiO4Hkdo0TVJh9Ntxr5MxPDI7/oFsrygN5ADelFSeXG/qgNuucIGA+L5Z6JpPTE/uRfcTWtscjbUaufepQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
   '@typespec/ts-http-runtime@0.3.8':
@@ -2501,8 +2650,8 @@ packages:
     cpu: [x64]
     os: [win32]
 
-  '@vitejs/plugin-react@6.1.0':
-    resolution: {integrity: sha512-qd2BzUBehkov86WFhg0JkEFEYyCLG9uPCe6qWTY/kRlss9OvJrOF2UbIWT7p+8IzZHkEu0DNGHc4HSv+JdDLsw==}
+  '@vitejs/plugin-react@6.1.1':
+    resolution: {integrity: sha512-yxLaQV9gkhS8ezJqCM6+ndU7mDY6gqAg75NQ+0IjwEI8IYOmQCgkRwHKVSfWXW076DsqMo0Dk+0FK1U+M5RgFw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     peerDependencies:
       '@rolldown/plugin-babel': ^0.1.7 || ^0.2.0
@@ -2742,8 +2891,8 @@ packages:
     resolution: {integrity: sha512-UzGt8zg7Ny8djbYMhxl2zuEevVa7r2gJjYY5Lwr1xM7+XU2nd6CkIWFTVcCIbAP63vSz71NaVyyuSk9lHKcy0A==}
     engines: {node: '>=4'}
 
-  axios@1.19.0:
-    resolution: {integrity: sha512-ht/iuYZXEjFxLH/Hkezgd7m6JKlHHXEUSneaDz8uZe1Gj5QZtCnpyDsckvAiEnT89OEbCLmnte4R4sn7P0EKFw==}
+  axios@1.20.0:
+    resolution: {integrity: sha512-r8aOh8j9cGKpgQAqpzrUHnSIc6a59Y3Xf/cv8sy1DrHCkZHzQGEuoq1tARk6qSyDdtQGSDgpb9kFlruzPvrgwg==}
 
   azure-devops-node-api@12.5.0:
     resolution: {integrity: sha512-R5eFskGvOm3U/GzeAuxRkUsAl0hrAwGgWn6zAd2KrZmrEhWZVqLew4OOupbQlXUuojUzpGtq62SmdhJ06N88og==}
@@ -2842,6 +2991,9 @@ packages:
       monocart-coverage-reports:
         optional: true
 
+  cacheable@2.5.0:
+    resolution: {integrity: sha512-60cyAOytib/OzBw1JNSoSV/boK1AtHryDIjvVBk7XbN4ugfkM3+Sry7fEjNgPMGgOjuaZPAp8ruZ0Cxafwyq9g==}
+
   call-bind-apply-helpers@1.0.2:
     resolution: {integrity: sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==}
     engines: {node: '>= 0.4'}
@@ -3289,8 +3441,8 @@ packages:
       eslint-import-resolver-node:
         optional: true
 
-  eslint-plugin-package-json@1.7.1:
-    resolution: {integrity: sha512-nlIlX7thB20+uExdYL0QGAmyjHXI+AgIAWpwTs45be4XkJFaOGjSrShxw42b51aUHWGtNrA+eLSkeA1RYm+ugA==}
+  eslint-plugin-package-json@1.8.0:
+    resolution: {integrity: sha512-nfWWrak5t8yPgSVchNOHCjdFW/pl3+1135Bxsq0KZKo6PUdWWqUTqOVBrvzw1S+8BNOhhEx5c/YxeeCSYySFog==}
     engines: {node: ^22.22.2 || >=24.15.0}
     peerDependencies:
       '@eslint/json': '>=1.0.0'
@@ -3299,8 +3451,8 @@ packages:
       '@eslint/json':
         optional: true
 
-  eslint-plugin-react-dom@5.18.6:
-    resolution: {integrity: sha512-xco47I0Agu+83QH2ONbgZd1JPLSXJON+gtFGJbOhgfPvetfO7UkcHu8iLpncopwyWekAXfhvomJsDlNLTm26/g==}
+  eslint-plugin-react-dom@5.19.0:
+    resolution: {integrity: sha512-QxWdjdPxQUI3SSMYR7WyrLew7pQzlOn5P3R5raWh2PiyavaBUbkfJhSJ307l1AaJOVLy5JeIB2Rl4bivwHAOIQ==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
@@ -3312,43 +3464,43 @@ packages:
     peerDependencies:
       eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0 || ^10.0.0
 
-  eslint-plugin-react-jsx@5.18.6:
-    resolution: {integrity: sha512-6EvzS5gZGfQ0byvSxgqV/F0qXTVnNGcCU7wgFZqz8I1IXmcbYyBCyU7gqNlKW1/1ptiZFmuwo57+eW6HyK+wEg==}
+  eslint-plugin-react-jsx@5.19.0:
+    resolution: {integrity: sha512-Upvpe50vpPi5jWvLqtBXoZEwaCz1pzszzoukK7qf0g1A6ZJ+XDJhi3yKmPQWBlp9c4GOwzwPuXGU5C2e8cHMbQ==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  eslint-plugin-react-naming-convention@5.18.6:
-    resolution: {integrity: sha512-3KZkJN8XDTq6YtaYvyWJt3GQRjW3WhoVuGgLfhf0yO+8H0GW78FkesqGe//+np+pBXwPv6hck4c8ViTEQJ9qIQ==}
+  eslint-plugin-react-naming-convention@5.19.0:
+    resolution: {integrity: sha512-H9ko2t+KYPBDOfr29D5hDAT6CXucHJKGQscI+/ndSmkBl9K/KaGWdhFiCzQPi5S2YwPkjrcuaSXIp/n8+PA5GA==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  eslint-plugin-react-rsc@5.18.6:
-    resolution: {integrity: sha512-4mzLkRKRpN9Rr5JMeNrxkMFLHce1ikAdsjAiPOSIgYwWSsQWxHwpMTf+UfjXgfB6CcAcyKCyIe5HmOMX2kUoVQ==}
+  eslint-plugin-react-rsc@5.19.0:
+    resolution: {integrity: sha512-XdfkB2XRS0b1WBkuxnRsWmhivNaBOLAIohBqWQItQycuket6wVliqSY+Q1NcTst4PdJ1bYzLuMgSXYsgwJMV7Q==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  eslint-plugin-react-web-api@5.18.6:
-    resolution: {integrity: sha512-r8s39AbHZ0071XcgCMoCdNkSARftqI6U/0bBJXPioVUw+hjp0n4EB27fsc69AHzRl/NJWA1oUJb+kcqxoWMR4w==}
+  eslint-plugin-react-web-api@5.19.0:
+    resolution: {integrity: sha512-wCNdYVHgdLmCikLicH6kfO6EE1SKzi63FlhLLGMGzzEAyvudvyfKI0+ZXDkFyjolvKXLQW6Thb8EeAFbHTZksw==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  eslint-plugin-react-x@5.18.6:
-    resolution: {integrity: sha512-VvxeREksTiY9Q7YnpNvQNrjapUGu43rQJXrtbjT9ADwXX5nZiyUqD7T7fkbUYfH6NPz2bYvnAmGEctIfEGTTfQ==}
+  eslint-plugin-react-x@5.19.0:
+    resolution: {integrity: sha512-HoweOyYhar8G2QEukOctSaK87Y3AzB3bn4ES+0VVhcNOOqBFphRaWqcvoNN8JE+5AKOhhpuzjVKY6DnGPCcAMw==}
     engines: {node: '>=22.0.0'}
     peerDependencies:
       eslint: '*'
       typescript: '*'
 
-  eslint-plugin-storybook@10.5.10:
-    resolution: {integrity: sha512-NeOu3axmhNZfRuHRciFH0a/OVgvtAJLRHAwiJjcGkPAcElNmwEPp+pqoiwxytx7kHInz7mVVoBfPwVc8kPmOLw==}
+  eslint-plugin-storybook@10.6.0:
+    resolution: {integrity: sha512-HK3yD5Nslv97buJ5JfT1xFkTOoyJgGIENmBoZZI3F8t2UpBzb/dHpKyCh5bQ8AvJWnhoM/WAtDNqyd9nq6xgcg==}
     peerDependencies:
       eslint: '>=8'
 
@@ -3364,8 +3516,8 @@ packages:
     resolution: {integrity: sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==}
     engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
-  eslint@10.9.0:
-    resolution: {integrity: sha512-5KeEOJZBfEVA47boFiBsf+6MmmJpffM7qEBg4pLla2e4nlKgdKlqCW0oSLOGsT8Wl5uCGJptLV1bkaiShj90Gw==}
+  eslint@10.10.0:
+    resolution: {integrity: sha512-NPXn6r5zl4uET1DAVPaOwzX3rut4c0wcmw3dWJAfOsTM5+TogXo0DDjz8pwm/hL8cyVNpHqeK4JpN0NjnyFFNw==}
     engines: {node: ^20.19.0 || ^22.13.0 || >=24}
     hasBin: true
     peerDependencies:
@@ -3455,9 +3607,8 @@ packages:
   fflate@0.8.3:
     resolution: {integrity: sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA==}
 
-  file-entry-cache@8.0.0:
-    resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==}
-    engines: {node: '>=16.0.0'}
+  file-entry-cache@11.1.5:
+    resolution: {integrity: sha512-+PFTHITI08JIGhnNpGNI8T8inUpgZfk3GNEqfT9R2zZV2iFXg3CvqzSl/uEhs7TSGujYRELEANyDvS8Fj7+S7Q==}
 
   fill-range@7.1.1:
     resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
@@ -3471,9 +3622,8 @@ packages:
     resolution: {integrity: sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==}
     engines: {node: '>=10'}
 
-  flat-cache@4.0.1:
-    resolution: {integrity: sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==}
-    engines: {node: '>=16'}
+  flat-cache@6.1.23:
+    resolution: {integrity: sha512-f++BY9pTk+983xK1FLzlLpmM0i0z+jHmx3QESGkURMXujQZz1k5wzwX6hjnQ8goaD0B+sYnDK1yZ6MTyZfUaqA==}
 
   flat@5.0.2:
     resolution: {integrity: sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ==}
@@ -3584,8 +3734,8 @@ packages:
     resolution: {integrity: sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw==}
     engines: {node: 18 || 20 || >=22}
 
-  globals@17.11.0:
-    resolution: {integrity: sha512-Z2I8hM+PbJDXQDq3Icgpzv+mPdwr68iZUU9d5WW4FuXfDUQfkZaZuvjMv42/5crNyw154+9+VWXbYrUgDXbxNw==}
+  globals@17.12.0:
+    resolution: {integrity: sha512-cezEd/DTyyht9cvSSURyygXPfy04GtWO/5e6ZPvH7fCtjKz9PYOmuawphw1Ctd1f6C+5JypXfGD7ahNMXvevBA==}
     engines: {node: '>=18'}
 
   globby@14.1.0:
@@ -3611,6 +3761,10 @@ packages:
     resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
     engines: {node: '>= 0.4'}
 
+  hashery@1.5.1:
+    resolution: {integrity: sha512-iZyKG96/JwPz1N55vj2Ie2vXbhu440zfUfJvSwEqEbeLluk7NnapfGqa7LH0mOsnDxTF85Mx8/dyR6HfqcbmbQ==}
+    engines: {node: '>=20'}
+
   hasown@2.0.4:
     resolution: {integrity: sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==}
     engines: {node: '>= 0.4'}
@@ -3625,6 +3779,12 @@ packages:
   hermes-parser@0.25.1:
     resolution: {integrity: sha512-6pEjquH3rqaI6cYAXYPcz9MS4rY6R4ngRgrgfDshRptUZIc3lw0MCIJIGDj9++mfySOuPTHB4nrSW99BCvOPIA==}
 
+  hookified@1.15.1:
+    resolution: {integrity: sha512-MvG/clsADq1GPM2KGo2nyfaWVyn9naPiXrqIe4jYjXNZQt238kWyOGrsyc/DmRAQ+Re6yeo6yX/yoNCG5KAEVg==}
+
+  hookified@2.2.0:
+    resolution: {integrity: sha512-p/LgFzRN5FeoD3DLS6bkUapeye6E4SI6yJs6KetENd18S+FBthqYq2amJUWpt5z0EQwwHemidjY5OqJGEKm5uA==}
+
   hosted-git-info@4.1.0:
     resolution: {integrity: sha512-kyCuEOWjJqZuDbRHzL8V93NzQhwIB71oFWSyzVo+KPZI+pnQPPxucdkrOZvkLRnrf5URsQM+IJ09Dw29cRALIA==}
     engines: {node: '>=10'}
@@ -3828,9 +3988,6 @@ packages:
     engines: {node: '>=6'}
     hasBin: true
 
-  json-buffer@3.0.1:
-    resolution: {integrity: sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==}
-
   json-schema-traverse@0.4.1:
     resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
 
@@ -3875,8 +4032,8 @@ packages:
   keytar@7.9.0:
     resolution: {integrity: sha512-VPD8mtVtm5JNtA2AErl6Chp06JBfy7diFQ7TQQhdpWOl6MrCRB+eRbvAZUsbGQS9kiMq0coJsy0W0vHpDCkWsQ==}
 
-  keyv@4.5.4:
-    resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
+  keyv@5.6.0:
+    resolution: {integrity: sha512-CYDD3SOtsHtyXeEORYRx2qBtpDJFjRTGXUtmNEMGyzYOKj1TE3tycdlho7kA1Ufx9OYWZzg52QFBGALTirzDSw==}
 
   leven@3.1.0:
     resolution: {integrity: sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A==}
@@ -4049,6 +4206,9 @@ packages:
   magic-string@0.30.21:
     resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
 
+  magic-string@1.2.3:
+    resolution: {integrity: sha512-Bpb0W2TbLKOZ7vJnOUnVRGq3WL2p+ISV29M6hYPL1AFCpyKZpdr5ytiXoTSSxRVhg8YW7f65+6gbG8WG6PCa/g==}
+
   magicast@0.5.4:
     resolution: {integrity: sha512-llBEhWm1SacoRwgHUoQJYtwp4PBLF4faQi5TCpIGyGs9n4y5+juI0tDgyKIfpqxckRHaHzouUEph3THklWh03w==}
 
@@ -4112,8 +4272,8 @@ packages:
   mdurl@2.1.0:
     resolution: {integrity: sha512-1+HBaOx0zi/dQWht8rNv9MYf9qqpqL/kxI0hXImU6Y547zM6Sni8BQibt7ifgMcYtQg41ao3Ivd6cnSM86inpg==}
 
-  memfs@4.68.1:
-    resolution: {integrity: sha512-OD+IDRUvIxu3QHL+nFm9gdyugInD27FDJ+sl4B5QgomPHXMlbw+GP918P8VNKu2FkNlVeqBkpzkwROpamVifRw==}
+  memfs@4.71.0:
+    resolution: {integrity: sha512-Zwrk7TpTXBkic7taZL+2QeppbauG0QOufRsT1zuXDYLW8jCajH0W1VSZ17+I7ODqiNbH9J1Vf1QJCqFlCfurDg==}
 
   merge2@1.4.1:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
@@ -4503,8 +4663,8 @@ packages:
     engines: {node: '>=14'}
     hasBin: true
 
-  pretty-bytes@7.1.1:
-    resolution: {integrity: sha512-X+vn9z8nOFZQlxOLmfJ0iKDdMD7jYTsTW12OAlCpdoE3Igik6L37pugIZi+N3usuyp5McfgKPWi12q3zvHLeGQ==}
+  pretty-bytes@7.1.3:
+    resolution: {integrity: sha512-U2KZ675nqba6XSBppSjU2pRgc9Ffx9+uUtd/RTWYmOawVkZuUbBYuwdtFZQmLv+yMgQ2TQxWWuOpyNje67J9tg==}
     engines: {node: '>=20'}
 
   pretty-format@27.5.1:
@@ -4560,6 +4720,10 @@ packages:
     resolution: {integrity: sha512-BbubeCEyTuQjVMakvJQ/Sxbc93F2pwmbsxONT/ZRrwU7Ua38d8unYTwXpTVLAKJ4BDuH9IGztCjQcd/N/39Dvg==}
     engines: {node: '>=16.0.0'}
 
+  qified@0.10.1:
+    resolution: {integrity: sha512-+Owyggi9IxT1ePKGafcI87ubSmxol6smwJ+RAHDQlx9+9cPwFWDiKFFCPuWhr9ignlGpZ9vDQLw67N4dcTVFEA==}
+    engines: {node: '>=20'}
+
   qs@6.15.3:
     resolution: {integrity: sha512-O9gl3zCl5h5blw1KGUzQKhA5oUXSl8rwUIM5o0S3nCXMliSvy5Dzx7/DJcI+SwgICv+IneSZwhBh1oSyEHA71A==}
     engines: {node: '>=0.6'}
@@ -4862,8 +5026,13 @@ packages:
     resolution: {integrity: sha512-UhDfHmA92YAlNnCfhmq0VeNL5bDbiZGg7sZ2IvPsXubGkiNa9EC+tUTsjBRsYUAz87btI6/1wf4XoVvQ3uRnmQ==}
     engines: {node: '>=18'}
 
-  storybook@10.5.10:
-    resolution: {integrity: sha512-Rz8k9ejFHsi7lbtJTaxZlhCUz4GkbJIKEoKDjXeLfr/ZhXip73E6keKxW0KH8iGeKiCqHAbJCV4YIQrxTOLiig==}
+  storybook-addon-pseudo-states@10.6.0:
+    resolution: {integrity: sha512-9jnKzeyMjvkKXpK/TxKuam6mrFLsnCM/g4nSmkM49ssBy/RfjHt3dOdTjRCF++r3as7lHntWNv1J4shJJJlEfQ==}
+    peerDependencies:
+      storybook: ^10.6.0
+
+  storybook@10.6.0:
+    resolution: {integrity: sha512-H48X6AURAFTpfN2zEux6vNesee5Oq8Gxj1IanYmblPZ218sfKSeyyerF1NC7GD7BrruoC8L4/cU0zII4y+d6zw==}
     hasBin: true
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
@@ -5100,8 +5269,8 @@ packages:
   typed-rest-client@1.8.11:
     resolution: {integrity: sha512-5UvfMpd1oelmUPRbbaVnq+rHP7ng2cE4qoQkQeAqxRL6PklkxsM0g32/HL0yfvruK6ojQ5x8EE+HF4YV6DtuCA==}
 
-  typescript-eslint@8.67.0:
-    resolution: {integrity: sha512-S2udFs8tCKEKffuJ4TB1idGUZiXdCPGi3IPBGWXarbLQ5UPXORV8QEVzJ4gCRduURMb5EkpNCdjbk0eDIuI8Yg==}
+  typescript-eslint@8.70.0:
+    resolution: {integrity: sha512-P/W5cz70/cQAuKfY3xwQMWWTV7BvJ0mAQmi+9mBcsVPaBUpd6Ohpa+fECv9rBFrQcig86jAiNBFNWUqnTjr4pw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
@@ -5466,8 +5635,8 @@ packages:
   zod@3.23.8:
     resolution: {integrity: sha512-XBx9AXhXktjUqnepgTiE5flcKIYWi/rme0Eaj+5Y0lftuGBq+jyRu/md4WnuxqgP1ubdpNCsYEYPxrzVHD8d6g==}
 
-  zod@4.4.3:
-    resolution: {integrity: sha512-ytENFjIJFl2UwYglde2jchW2Hwm4GJFLDiSXWdTrJQBIN9Fcyp7n4DhxJEiWNAJMV1/BqWfW/kkg71UDcHJyTQ==}
+  zod@4.5.4:
+    resolution: {integrity: sha512-sC95tT5iHHH9gtpj6A81kh+NEaRAUFN+qlUPDUbRfOMvNf5QCBqsb3WgvnpVtK5Y+4UfA6KqufotuTvMGiTlsA==}
 
   zwitch@2.0.4:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
@@ -5742,15 +5911,27 @@ snapshots:
     dependencies:
       css-tree: 3.2.1
 
+  '@cacheable/memory@2.2.0':
+    dependencies:
+      '@cacheable/utils': 2.5.0
+      '@keyv/bigmap': 1.3.1(keyv@5.6.0)
+      hookified: 1.15.1
+      keyv: 5.6.0
+
+  '@cacheable/utils@2.5.0':
+    dependencies:
+      hashery: 1.5.1
+      keyv: 5.6.0
+
   '@coder/coder@https://codeload.github.com/coder/coder/tar.gz/9548f239a8bdfe74d0f62eafc41c97b2d7adca91': {}
 
-  '@coder/pixel-storybook@0.3.0(playwright-core@1.62.1)(storybook@10.5.10)':
+  '@coder/pixel-storybook@0.3.0(playwright-core@1.62.1)(storybook@10.6.0)':
     dependencies:
       get-port-please: 3.1.2
       jsonc-parser: 3.3.1
       playwright-core: 1.62.1
       serve-handler: 6.1.7
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
       zod: 3.23.8
 
   '@csstools/color-helpers@6.1.1': {}
@@ -5915,94 +6096,94 @@ snapshots:
   '@esbuild/win32-x64@0.28.2':
     optional: true
 
-  '@eslint-community/eslint-utils@4.10.1(eslint@10.9.0)':
+  '@eslint-community/eslint-utils@4.10.1(eslint@10.10.0)':
     dependencies:
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       eslint-visitor-keys: 3.4.3
 
   '@eslint-community/regexpp@4.12.2': {}
 
-  '@eslint-react/ast@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/ast@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/typescript-estree': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/typescript-estree': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       string-ts: 2.3.1
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint-react/core@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/core@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/var': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/scope-manager': 8.67.0
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/var': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/scope-manager': 8.70.0
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-pattern: 5.9.0
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint-react/eslint-plugin@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/eslint-plugin@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
-      eslint-plugin-react-dom: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint-plugin-react-jsx: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint-plugin-react-naming-convention: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint-plugin-react-rsc: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint-plugin-react-web-api: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint-plugin-react-x: 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
+      eslint-plugin-react-dom: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint-plugin-react-jsx: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint-plugin-react-naming-convention: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint-plugin-react-rsc: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint-plugin-react-web-api: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint-plugin-react-x: 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint-react/eslint@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/eslint@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint-react/jsx@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/jsx@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/var': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/var': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-pattern: 5.9.0
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint-react/shared@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/shared@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-pattern: 5.9.0
       typescript: 6.0.3
-      zod: 4.4.3
+      zod: 4.5.4
     transitivePeerDependencies:
       - supports-color
 
-  '@eslint-react/var@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@eslint-react/var@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/scope-manager': 8.67.0
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/scope-manager': 8.70.0
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-pattern: 5.9.0
       typescript: 6.0.3
     transitivePeerDependencies:
@@ -6024,9 +6205,9 @@ snapshots:
     dependencies:
       '@types/json-schema': 7.0.15
 
-  '@eslint/js@10.0.1(eslint@10.9.0)':
+  '@eslint/js@10.0.1(eslint@10.10.0)':
     optionalDependencies:
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
 
   '@eslint/markdown@8.0.3(supports-color@8.1.1)':
     dependencies:
@@ -6051,6 +6232,11 @@ snapshots:
       '@eslint/core': 1.2.1
       levn: 0.4.1
 
+  '@eslint/plugin-kit@0.7.3':
+    dependencies:
+      '@eslint/core': 1.2.1
+      levn: 0.4.1
+
   '@exodus/bytes@1.15.1': {}
 
   '@floating-ui/core@1.8.0':
@@ -6148,59 +6334,59 @@ snapshots:
     dependencies:
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-core@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-core@4.71.0(tslib@2.8.1)':
     dependencies:
-      '@jsonjoy.com/fs-node-builtins': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-builtins': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
       thingies: 2.6.1(tslib@2.8.1)
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-fsa@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-fsa@4.71.0(tslib@2.8.1)':
     dependencies:
-      '@jsonjoy.com/fs-core': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-builtins': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-core': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-builtins': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
       thingies: 2.6.1(tslib@2.8.1)
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-node-builtins@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-node-builtins@4.71.0(tslib@2.8.1)':
     dependencies:
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-node-to-fsa@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-node-to-fsa@4.71.0(tslib@2.8.1)':
     dependencies:
-      '@jsonjoy.com/fs-fsa': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-builtins': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-fsa': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-builtins': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-node-utils@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-node-utils@4.71.0(tslib@2.8.1)':
     dependencies:
-      '@jsonjoy.com/fs-node-builtins': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-builtins': 4.71.0(tslib@2.8.1)
       glob-to-regex.js: 1.2.0(tslib@2.8.1)
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-node@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-node@4.71.0(tslib@2.8.1)':
     dependencies:
-      '@jsonjoy.com/fs-core': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-builtins': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-print': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-snapshot': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-core': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-builtins': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-print': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-snapshot': 4.71.0(tslib@2.8.1)
       glob-to-regex.js: 1.2.0(tslib@2.8.1)
       thingies: 2.6.1(tslib@2.8.1)
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-print@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-print@4.71.0(tslib@2.8.1)':
     dependencies:
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
       tree-dump: 1.1.0(tslib@2.8.1)
       tslib: 2.8.1
 
-  '@jsonjoy.com/fs-snapshot@4.68.1(tslib@2.8.1)':
+  '@jsonjoy.com/fs-snapshot@4.71.0(tslib@2.8.1)':
     dependencies:
       '@jsonjoy.com/buffers': 17.67.0(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
       '@jsonjoy.com/json-pack': 17.67.0(tslib@2.8.1)
       '@jsonjoy.com/util': 17.67.0(tslib@2.8.1)
       tslib: 2.8.1
@@ -6252,6 +6438,14 @@ snapshots:
       '@jsonjoy.com/codegen': 17.67.0(tslib@2.8.1)
       tslib: 2.8.1
 
+  '@keyv/bigmap@1.3.1(keyv@5.6.0)':
+    dependencies:
+      hashery: 1.5.1
+      hookified: 1.15.1
+      keyv: 5.6.0
+
+  '@keyv/serialize@1.1.1': {}
+
   '@lit-labs/ssr-dom-shim@1.6.0': {}
 
   '@lit/context@1.1.6':
@@ -6305,7 +6499,7 @@ snapshots:
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.20.1
 
-  '@opentelemetry/api-logs@0.221.0':
+  '@opentelemetry/api-logs@0.222.0':
     dependencies:
       '@opentelemetry/api': 1.9.1
 
@@ -6536,28 +6730,30 @@ snapshots:
   '@pkgjs/parseargs@0.11.0':
     optional: true
 
+  '@radix-ui/number@1.1.3': {}
+
   '@radix-ui/primitive@1.1.7': {}
 
-  '@radix-ui/react-arrow@1.1.15(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-arrow@1.1.15(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-collection@1.1.15(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-collection@1.1.15(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-slot': 1.3.3(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/react-compose-refs@1.1.5(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
@@ -6565,18 +6761,18 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
-  '@radix-ui/react-context-menu@2.3.7(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-context-menu@2.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/primitive': 1.1.7
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-menu': 2.1.24(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-menu': 2.1.24(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-controllable-state': 1.2.6(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/react-context@1.2.2(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
@@ -6590,33 +6786,33 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
-  '@radix-ui/react-dismissable-layer@1.1.19(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-dismissable-layer@1.1.19(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/primitive': 1.1.7
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-callback-ref': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-effect-event': 0.0.5(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-dropdown-menu@2.1.24(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-dropdown-menu@2.1.24(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/primitive': 1.1.7
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-id': 1.1.4(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-menu': 2.1.24(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-menu': 2.1.24(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-controllable-state': 1.2.6(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/react-focus-guards@1.1.6(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
@@ -6624,16 +6820,16 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
-  '@radix-ui/react-focus-scope@1.1.16(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-focus-scope@1.1.16(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-callback-ref': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/react-id@1.1.4(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
@@ -6642,22 +6838,22 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
-  '@radix-ui/react-menu@2.1.24(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-menu@2.1.24(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/primitive': 1.1.7
-      '@radix-ui/react-collection': 1.1.15(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-collection': 1.1.15(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-direction': 1.1.4(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-dismissable-layer': 1.1.19(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-dismissable-layer': 1.1.19(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-focus-guards': 1.1.6(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-focus-scope': 1.1.16(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-focus-scope': 1.1.16(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-id': 1.1.4(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-popper': 1.3.7(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-portal': 1.1.17(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-presence': 1.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-roving-focus': 1.1.19(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-popper': 1.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-portal': 1.1.17(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-presence': 1.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-roving-focus': 1.1.19(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-slot': 1.3.3(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-callback-ref': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       aria-hidden: 1.2.6
@@ -6666,15 +6862,15 @@ snapshots:
       react-remove-scroll: 2.7.2(@types/react@19.2.18)(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-popper@1.3.7(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-popper@1.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@floating-ui/react-dom': 2.1.9(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-arrow': 1.1.15(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-arrow': 1.1.15(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-callback-ref': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-layout-effect': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-rect': 1.1.4(@types/react@19.2.18)(react@19.2.8)
@@ -6684,45 +6880,45 @@ snapshots:
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-portal@1.1.17(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-portal@1.1.17(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-layout-effect': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-presence@1.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-presence@1.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/react-use-layout-effect': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-primitive@2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-primitive@2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/react-slot': 1.3.3(@types/react@19.2.18)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@radix-ui/react-roving-focus@1.1.19(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-roving-focus@1.1.19(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/primitive': 1.1.7
-      '@radix-ui/react-collection': 1.1.15(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-collection': 1.1.15(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-direction': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-id': 1.1.4(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-use-callback-ref': 1.1.4(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-controllable-state': 1.2.6(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-is-hydrated': 0.1.3(@types/react@19.2.18)(react@19.2.8)
@@ -6731,7 +6927,37 @@ snapshots:
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
+
+  '@radix-ui/react-select@2.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+    dependencies:
+      '@radix-ui/number': 1.1.3
+      '@radix-ui/primitive': 1.1.7
+      '@radix-ui/react-collection': 1.1.15(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-direction': 1.1.4(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-dismissable-layer': 1.1.19(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-focus-guards': 1.1.6(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-focus-scope': 1.1.16(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-id': 1.1.4(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-popper': 1.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-portal': 1.1.17(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-presence': 1.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-slot': 1.3.3(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-use-callback-ref': 1.1.4(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-use-controllable-state': 1.2.6(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-use-layout-effect': 1.1.4(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-use-previous': 1.1.4(@types/react@19.2.18)(react@19.2.8)
+      '@radix-ui/react-visually-hidden': 1.2.11(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      aria-hidden: 1.2.6
+      react: 19.2.8
+      react-dom: 19.2.8(react@19.2.8)
+      react-remove-scroll: 2.7.2(@types/react@19.2.18)(react@19.2.8)
+    optionalDependencies:
+      '@types/react': 19.2.18
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/react-slot@1.3.3(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
@@ -6740,26 +6966,26 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
-  '@radix-ui/react-tooltip@1.2.16(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-tooltip@1.2.16(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@radix-ui/primitive': 1.1.7
       '@radix-ui/react-compose-refs': 1.1.5(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-context': 1.2.2(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-dismissable-layer': 1.1.19(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-dismissable-layer': 1.1.19(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-id': 1.1.4(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-popper': 1.3.7(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-portal': 1.1.17(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-presence': 1.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-popper': 1.3.7(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-portal': 1.1.17(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-presence': 1.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       '@radix-ui/react-slot': 1.3.3(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-controllable-state': 1.2.6(@types/react@19.2.18)(react@19.2.8)
       '@radix-ui/react-use-layout-effect': 1.1.4(@types/react@19.2.18)(react@19.2.8)
-      '@radix-ui/react-visually-hidden': 1.2.11(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-visually-hidden': 1.2.11(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/react-use-callback-ref@1.1.4(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
@@ -6795,6 +7021,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
+  '@radix-ui/react-use-previous@1.1.4(@types/react@19.2.18)(react@19.2.8)':
+    dependencies:
+      react: 19.2.8
+    optionalDependencies:
+      '@types/react': 19.2.18
+
   '@radix-ui/react-use-rect@1.1.4(@types/react@19.2.18)(react@19.2.8)':
     dependencies:
       '@radix-ui/rect': 1.1.3
@@ -6809,14 +7041,14 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.2.18
 
-  '@radix-ui/react-visually-hidden@1.2.11(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@radix-ui/react-visually-hidden@1.2.11(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
-      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
+      '@radix-ui/react-primitive': 2.1.10(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
   '@radix-ui/rect@1.1.3': {}
 
@@ -6960,49 +7192,32 @@ snapshots:
 
   '@standard-schema/spec@1.1.0': {}
 
-  '@storybook/addon-a11y@10.5.10(storybook@10.5.10)':
+  '@storybook/addon-a11y@10.6.0(storybook@10.6.0)':
     dependencies:
       '@storybook/global': 5.0.0
       axe-core: 4.13.0
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
 
-  '@storybook/addon-docs@10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)':
+  '@storybook/addon-docs@10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(storybook@10.6.0)':
     dependencies:
       '@mdx-js/react': 3.1.1(@types/react@19.2.18)(react@19.2.8)
-      '@storybook/csf-plugin': 10.5.10(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)
       '@storybook/icons': 2.1.0(react@19.2.8)
-      '@storybook/react-dom-shim': 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)
+      '@storybook/react-dom-shim': 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
       ts-dedent: 2.3.0
+      unplugin: 2.3.11
     optionalDependencies:
       '@types/react': 19.2.18
     transitivePeerDependencies:
       - '@types/react-dom'
-      - esbuild
-      - rollup
-      - vite
-      - webpack
 
-  '@storybook/builder-vite@10.5.10(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)':
+  '@storybook/builder-vite@10.6.0(storybook@10.6.0)(vite@8.2.2)':
     dependencies:
-      '@storybook/csf-plugin': 10.5.10(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
       ts-dedent: 2.3.0
       vite: 8.2.2(@types/node@22.20.1)(esbuild@0.28.2)
-    transitivePeerDependencies:
-      - esbuild
-      - rollup
-      - webpack
-
-  '@storybook/csf-plugin@10.5.10(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)':
-    dependencies:
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
-      unplugin: 2.3.11
-    optionalDependencies:
-      esbuild: 0.28.2
-      vite: 8.2.2(@types/node@22.20.1)(esbuild@0.28.2)
 
   '@storybook/global@5.0.0': {}
 
@@ -7010,28 +7225,28 @@ snapshots:
     dependencies:
       react: 19.2.8
 
-  '@storybook/react-dom-shim@10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)':
+  '@storybook/react-dom-shim@10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)':
     dependencies:
       react: 19.2.8
       react-dom: 19.2.8(react@19.2.8)
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@storybook/react-vite@10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.2)':
+  '@storybook/react-vite@10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@10.2.2)(typescript@6.0.3)(vite@8.2.2)':
     dependencies:
       '@joshwooding/vite-plugin-react-docgen-typescript': 0.7.0(typescript@6.0.3)(vite@8.2.2)
       '@rollup/pluginutils': 5.4.0
-      '@storybook/builder-vite': 10.5.10(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)
-      '@storybook/react': 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@10.2.2)(typescript@6.0.3)
+      '@storybook/builder-vite': 10.6.0(storybook@10.6.0)(vite@8.2.2)
+      '@storybook/react': 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@10.2.2)(typescript@6.0.3)
       empathic: 2.0.1
-      magic-string: 0.30.21
+      magic-string: 1.2.3
       react: 19.2.8
       react-docgen: 8.0.3(supports-color@10.2.2)
       react-dom: 19.2.8(react@19.2.8)
       resolve: 1.22.12
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
       tsconfig-paths: 4.2.0
       vite: 8.2.2(@types/node@22.20.1)(esbuild@0.28.2)
     optionalDependencies:
@@ -7039,24 +7254,22 @@ snapshots:
     transitivePeerDependencies:
       - '@types/react'
       - '@types/react-dom'
-      - esbuild
       - rollup
       - supports-color
-      - webpack
 
-  '@storybook/react-vite@10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(esbuild@0.28.2)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@8.1.1)(typescript@6.0.3)(vite@8.2.2)':
+  '@storybook/react-vite@10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@8.1.1)(typescript@6.0.3)(vite@8.2.2)':
     dependencies:
       '@joshwooding/vite-plugin-react-docgen-typescript': 0.7.0(typescript@6.0.3)(vite@8.2.2)
       '@rollup/pluginutils': 5.4.0
-      '@storybook/builder-vite': 10.5.10(esbuild@0.28.2)(storybook@10.5.10)(vite@8.2.2)
-      '@storybook/react': 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@8.1.1)(typescript@6.0.3)
+      '@storybook/builder-vite': 10.6.0(storybook@10.6.0)(vite@8.2.2)
+      '@storybook/react': 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@8.1.1)(typescript@6.0.3)
       empathic: 2.0.1
-      magic-string: 0.30.21
+      magic-string: 1.2.3
       react: 19.2.8
       react-docgen: 8.0.3(supports-color@8.1.1)
       react-dom: 19.2.8(react@19.2.8)
       resolve: 1.22.12
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
       tsconfig-paths: 4.2.0
       vite: 8.2.2(@types/node@22.20.1)(esbuild@0.28.2)
     optionalDependencies:
@@ -7064,48 +7277,46 @@ snapshots:
     transitivePeerDependencies:
       - '@types/react'
       - '@types/react-dom'
-      - esbuild
       - rollup
       - supports-color
-      - webpack
 
-  '@storybook/react@10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@10.2.2)(typescript@6.0.3)':
+  '@storybook/react@10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@10.2.2)(typescript@6.0.3)':
     dependencies:
       '@storybook/global': 5.0.0
-      '@storybook/react-dom-shim': 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)
+      '@storybook/react-dom-shim': 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)
       react: 19.2.8
       react-docgen: 8.0.3(supports-color@10.2.2)
       react-docgen-typescript: 2.4.0(typescript@6.0.3)
       react-dom: 19.2.8(react@19.2.8)
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@storybook/react@10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@storybook/react@10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
       '@storybook/global': 5.0.0
-      '@storybook/react-dom-shim': 10.5.10(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.5.10)
+      '@storybook/react-dom-shim': 10.6.0(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)(storybook@10.6.0)
       react: 19.2.8
       react-docgen: 8.0.3(supports-color@8.1.1)
       react-docgen-typescript: 2.4.0(typescript@6.0.3)
       react-dom: 19.2.8(react@19.2.8)
-      storybook: 10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@tanstack/query-core@5.102.2': {}
+  '@tanstack/query-core@5.102.8': {}
 
-  '@tanstack/react-query@5.102.2(react@19.2.8)':
+  '@tanstack/react-query@5.102.8(react@19.2.8)':
     dependencies:
-      '@tanstack/query-core': 5.102.2
+      '@tanstack/query-core': 5.102.8
       react: 19.2.8
 
   '@testing-library/dom@10.4.1':
@@ -7140,7 +7351,7 @@ snapshots:
     optionalDependencies:
       vitest: 4.1.11(@opentelemetry/api@1.9.1)(@types/node@22.20.1)(@vitest/coverage-v8@4.1.11)(jsdom@30.0.1)(vite@8.2.2)
 
-  '@testing-library/react@16.3.2(@testing-library/dom@10.4.1)(@types/react-dom@19.2.5)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
+  '@testing-library/react@16.3.3(@testing-library/dom@10.4.1)(@types/react-dom@19.2.7)(@types/react@19.2.18)(react-dom@19.2.8)(react@19.2.8)':
     dependencies:
       '@babel/runtime': 7.29.7
       '@testing-library/dom': 10.4.1
@@ -7148,9 +7359,9 @@ snapshots:
       react-dom: 19.2.8(react@19.2.8)
     optionalDependencies:
       '@types/react': 19.2.18
-      '@types/react-dom': 19.2.5(@types/react@19.2.18)
+      '@types/react-dom': 19.2.7(@types/react@19.2.18)
 
-  '@testing-library/user-event@14.6.6(@testing-library/dom@10.4.1)':
+  '@testing-library/user-event@14.6.7(@testing-library/dom@10.4.1)':
     dependencies:
       '@testing-library/dom': 10.4.1
 
@@ -7263,7 +7474,7 @@ snapshots:
     dependencies:
       '@types/retry': 0.12.5
 
-  '@types/react-dom@19.2.5(@types/react@19.2.18)':
+  '@types/react-dom@19.2.7(@types/react@19.2.18)':
     dependencies:
       '@types/react': 19.2.18
 
@@ -7293,15 +7504,15 @@ snapshots:
     dependencies:
       '@types/node': 22.20.1
 
-  '@typescript-eslint/eslint-plugin@8.67.0(@typescript-eslint/parser@8.67.0)(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@typescript-eslint/eslint-plugin@8.70.0(@typescript-eslint/parser@8.70.0)(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
       '@eslint-community/regexpp': 4.12.2
-      '@typescript-eslint/parser': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/scope-manager': 8.67.0
-      '@typescript-eslint/type-utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/visitor-keys': 8.67.0
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@typescript-eslint/parser': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/scope-manager': 8.70.0
+      '@typescript-eslint/type-utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/visitor-keys': 8.70.0
+      eslint: 10.10.0(supports-color@8.1.1)
       ignore: 7.0.6
       natural-compare: 1.4.0
       ts-api-utils: 2.5.0(typescript@6.0.3)
@@ -7309,43 +7520,43 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/parser@8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@typescript-eslint/parser@8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/scope-manager': 8.67.0
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/typescript-estree': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/visitor-keys': 8.67.0
+      '@typescript-eslint/scope-manager': 8.70.0
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/typescript-estree': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/visitor-keys': 8.70.0
       debug: 4.4.3(supports-color@8.1.1)
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/project-service@8.67.0(supports-color@8.1.1)(typescript@6.0.3)':
+  '@typescript-eslint/project-service@8.70.0(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/tsconfig-utils': 8.67.0(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
+      '@typescript-eslint/tsconfig-utils': 8.70.0(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
       debug: 4.4.3(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/scope-manager@8.67.0':
+  '@typescript-eslint/scope-manager@8.70.0':
     dependencies:
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/visitor-keys': 8.67.0
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/visitor-keys': 8.70.0
 
-  '@typescript-eslint/tsconfig-utils@8.67.0(typescript@6.0.3)':
+  '@typescript-eslint/tsconfig-utils@8.70.0(typescript@6.0.3)':
     dependencies:
       typescript: 6.0.3
 
-  '@typescript-eslint/type-utils@8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@typescript-eslint/type-utils@8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/typescript-estree': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/typescript-estree': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       debug: 4.4.3(supports-color@8.1.1)
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-api-utils: 2.5.0(typescript@6.0.3)
       typescript: 6.0.3
     transitivePeerDependencies:
@@ -7353,12 +7564,14 @@ snapshots:
 
   '@typescript-eslint/types@8.67.0': {}
 
-  '@typescript-eslint/typescript-estree@8.67.0(supports-color@8.1.1)(typescript@6.0.3)':
+  '@typescript-eslint/types@8.70.0': {}
+
+  '@typescript-eslint/typescript-estree@8.70.0(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@typescript-eslint/project-service': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/tsconfig-utils': 8.67.0(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/visitor-keys': 8.67.0
+      '@typescript-eslint/project-service': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/tsconfig-utils': 8.70.0(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/visitor-keys': 8.70.0
       debug: 4.4.3(supports-color@8.1.1)
       minimatch: 10.2.6
       semver: 7.8.5
@@ -7368,20 +7581,20 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/utils@8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)':
+  '@typescript-eslint/utils@8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)':
     dependencies:
-      '@eslint-community/eslint-utils': 4.10.1(eslint@10.9.0)
-      '@typescript-eslint/scope-manager': 8.67.0
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/typescript-estree': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.10.0)
+      '@typescript-eslint/scope-manager': 8.70.0
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/typescript-estree': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/visitor-keys@8.67.0':
+  '@typescript-eslint/visitor-keys@8.70.0':
     dependencies:
-      '@typescript-eslint/types': 8.67.0
+      '@typescript-eslint/types': 8.70.0
       eslint-visitor-keys: 5.0.1
 
   '@typespec/ts-http-runtime@0.3.8(supports-color@8.1.1)':
@@ -7462,7 +7675,7 @@ snapshots:
   '@unrs/resolver-binding-win32-x64-msvc@1.12.2':
     optional: true
 
-  '@vitejs/plugin-react@6.1.0(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)':
+  '@vitejs/plugin-react@6.1.1(@rolldown/plugin-babel@0.2.3)(babel-plugin-react-compiler@1.0.0)(vite@8.2.2)':
     dependencies:
       '@rolldown/pluginutils': 1.0.1
       vite: 8.2.2(@types/node@22.20.1)(esbuild@0.28.2)
@@ -7752,7 +7965,7 @@ snapshots:
 
   axe-core@4.13.0: {}
 
-  axios@1.19.0(debug@4.4.3)(supports-color@8.1.1):
+  axios@1.20.0(debug@4.4.3)(supports-color@8.1.1):
     dependencies:
       follow-redirects: 1.16.0(debug@4.4.3)
       form-data: 4.0.6
@@ -7864,6 +8077,14 @@ snapshots:
       yargs: 17.7.3
       yargs-parser: 21.1.1
 
+  cacheable@2.5.0:
+    dependencies:
+      '@cacheable/memory': 2.2.0
+      '@cacheable/utils': 2.5.0
+      hookified: 1.15.1
+      keyv: 5.6.0
+      qified: 0.10.1
+
   call-bind-apply-helpers@1.0.2:
     dependencies:
       es-errors: 1.3.0
@@ -8250,13 +8471,13 @@ snapshots:
     optionalDependencies:
       source-map: 0.6.1
 
-  eslint-config-prettier@10.1.8(eslint@10.9.0):
+  eslint-config-prettier@10.1.8(eslint@10.10.0):
     dependencies:
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
 
-  eslint-fix-utils@0.4.3(@types/estree@1.0.9)(eslint@10.9.0):
+  eslint-fix-utils@0.4.3(@types/estree@1.0.9)(eslint@10.10.0):
     dependencies:
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
     optionalDependencies:
       '@types/estree': 1.0.9
 
@@ -8267,10 +8488,10 @@ snapshots:
     optionalDependencies:
       unrs-resolver: 1.12.2
 
-  eslint-import-resolver-typescript@4.4.5(eslint-plugin-import-x@4.17.1)(eslint@10.9.0)(supports-color@8.1.1):
+  eslint-import-resolver-typescript@4.4.5(eslint-plugin-import-x@4.17.1)(eslint@10.10.0)(supports-color@8.1.1):
     dependencies:
       debug: 4.4.3(supports-color@8.1.1)
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       eslint-import-context: 0.1.9(unrs-resolver@1.12.2)
       get-tsconfig: 4.14.3
       is-bun-module: 2.0.0
@@ -8278,22 +8499,22 @@ snapshots:
       tinyglobby: 0.2.17
       unrs-resolver: 1.12.2
     optionalDependencies:
-      eslint-plugin-import-x: 4.17.1(@typescript-eslint/utils@8.67.0)(eslint@10.9.0)(supports-color@8.1.1)
+      eslint-plugin-import-x: 4.17.1(@typescript-eslint/utils@8.70.0)(eslint@10.10.0)(supports-color@8.1.1)
     transitivePeerDependencies:
       - supports-color
 
-  eslint-json-compat-utils@0.2.3(eslint@10.9.0)(jsonc-eslint-parser@3.3.0):
+  eslint-json-compat-utils@0.2.3(eslint@10.10.0)(jsonc-eslint-parser@3.3.0):
     dependencies:
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       esquery: 1.7.0
       jsonc-eslint-parser: 3.3.0
 
-  eslint-plugin-import-x@4.17.1(@typescript-eslint/utils@8.67.0)(eslint@10.9.0)(supports-color@8.1.1):
+  eslint-plugin-import-x@4.17.1(@typescript-eslint/utils@8.70.0)(eslint@10.10.0)(supports-color@8.1.1):
     dependencies:
       '@typescript-eslint/types': 8.67.0
       comment-parser: 1.4.8
       debug: 4.4.3(supports-color@8.1.1)
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       eslint-import-context: 0.1.9(unrs-resolver@1.12.2)
       is-glob: 4.0.3
       minimatch: 10.2.6
@@ -8301,125 +8522,125 @@ snapshots:
       stable-hash-x: 0.2.0
       unrs-resolver: 1.12.2
     optionalDependencies:
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-package-json@1.7.1(eslint@10.9.0):
+  eslint-plugin-package-json@1.8.0(eslint@10.10.0):
     dependencies:
       '@altano/repository-tools': 2.1.0
       '@types/estree': 1.0.9
       change-case: 5.4.4
       detect-indent: 7.0.2
       detect-newline: 4.0.1
-      eslint: 10.9.0(supports-color@8.1.1)
-      eslint-fix-utils: 0.4.3(@types/estree@1.0.9)(eslint@10.9.0)
-      eslint-json-compat-utils: 0.2.3(eslint@10.9.0)(jsonc-eslint-parser@3.3.0)
+      eslint: 10.10.0(supports-color@8.1.1)
+      eslint-fix-utils: 0.4.3(@types/estree@1.0.9)(eslint@10.10.0)
+      eslint-json-compat-utils: 0.2.3(eslint@10.10.0)(jsonc-eslint-parser@3.3.0)
       jsonc-eslint-parser: 3.3.0
       package-json-validator: 1.6.1
       semver: 7.8.5
       sort-object-keys: 2.1.0
       sort-package-json: 4.0.0
 
-  eslint-plugin-react-dom@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  eslint-plugin-react-dom@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/jsx': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/jsx': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       compare-versions: 6.1.1
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-react-hooks@7.1.1(eslint@10.9.0)(supports-color@8.1.1):
+  eslint-plugin-react-hooks@7.1.1(eslint@10.10.0)(supports-color@8.1.1):
     dependencies:
       '@babel/core': 7.29.7(supports-color@8.1.1)
       '@babel/parser': 7.29.8
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       hermes-parser: 0.25.1
-      zod: 4.4.3
-      zod-validation-error: 4.0.2(zod@4.4.3)
+      zod: 4.5.4
+      zod-validation-error: 4.0.2(zod@4.5.4)
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-react-jsx@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  eslint-plugin-react-jsx@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/core': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/jsx': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/core': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/jsx': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-react-naming-convention@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  eslint-plugin-react-naming-convention@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/core': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/var': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/core': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/var': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-pattern: 5.9.0
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-react-rsc@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  eslint-plugin-react-rsc@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/core': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/var': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/core': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/var': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-react-web-api@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  eslint-plugin-react-web-api@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/core': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/var': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/core': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/var': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       birecord: 0.1.2
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       ts-pattern: 5.9.0
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-react-x@5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
-    dependencies:
-      '@eslint-react/ast': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/core': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/eslint': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/jsx': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/shared': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@eslint-react/var': 5.18.6(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/scope-manager': 8.67.0
-      '@typescript-eslint/type-utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/typescript-estree': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
+  eslint-plugin-react-x@5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
+    dependencies:
+      '@eslint-react/ast': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/core': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/eslint': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/jsx': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/shared': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@eslint-react/var': 5.19.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/scope-manager': 8.70.0
+      '@typescript-eslint/type-utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/typescript-estree': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
       compare-versions: 6.1.1
-      eslint: 10.9.0(supports-color@8.1.1)
+      eslint: 10.10.0(supports-color@8.1.1)
       string-ts: 2.3.1
       ts-api-utils: 2.5.0(typescript@6.0.3)
       ts-pattern: 5.9.0
@@ -8427,11 +8648,11 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  eslint-plugin-storybook@10.5.10(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  eslint-plugin-storybook@10.6.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@typescript-eslint/types': 8.67.0
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@typescript-eslint/types': 8.70.0
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
     transitivePeerDependencies:
       - supports-color
       - typescript
@@ -8447,14 +8668,14 @@ snapshots:
 
   eslint-visitor-keys@5.0.1: {}
 
-  eslint@10.9.0(supports-color@8.1.1):
+  eslint@10.10.0(supports-color@8.1.1):
     dependencies:
-      '@eslint-community/eslint-utils': 4.10.1(eslint@10.9.0)
+      '@eslint-community/eslint-utils': 4.10.1(eslint@10.10.0)
       '@eslint-community/regexpp': 4.12.2
       '@eslint/config-array': 0.23.5(supports-color@8.1.1)
       '@eslint/config-helpers': 0.7.0
       '@eslint/core': 1.2.1
-      '@eslint/plugin-kit': 0.7.2
+      '@eslint/plugin-kit': 0.7.3
       '@humanfs/node': 0.16.8
       '@humanwhocodes/module-importer': 1.0.1
       '@humanwhocodes/retry': 0.4.3
@@ -8469,7 +8690,7 @@ snapshots:
       esquery: 1.7.0
       esutils: 2.0.3
       fast-deep-equal: 3.1.3
-      file-entry-cache: 8.0.0
+      file-entry-cache: 11.1.5
       find-up: 5.0.0
       glob-parent: 6.0.2
       ignore: 5.3.2
@@ -8549,9 +8770,9 @@ snapshots:
 
   fflate@0.8.3: {}
 
-  file-entry-cache@8.0.0:
+  file-entry-cache@11.1.5:
     dependencies:
-      flat-cache: 4.0.1
+      flat-cache: 6.1.23
 
   fill-range@7.1.1:
     dependencies:
@@ -8568,10 +8789,11 @@ snapshots:
       locate-path: 6.0.0
       path-exists: 4.0.0
 
-  flat-cache@4.0.1:
+  flat-cache@6.1.23:
     dependencies:
+      cacheable: 2.5.0
       flatted: 3.4.4
-      keyv: 4.5.4
+      hookified: 1.15.1
 
   flat@5.0.2: {}
 
@@ -8684,7 +8906,7 @@ snapshots:
       minipass: 7.1.3
       path-scurry: 2.0.2
 
-  globals@17.11.0: {}
+  globals@17.12.0: {}
 
   globby@14.1.0:
     dependencies:
@@ -8707,6 +8929,10 @@ snapshots:
     dependencies:
       has-symbols: 1.1.0
 
+  hashery@1.5.1:
+    dependencies:
+      hookified: 1.15.1
+
   hasown@2.0.4:
     dependencies:
       function-bind: 1.1.2
@@ -8719,6 +8945,10 @@ snapshots:
     dependencies:
       hermes-estree: 0.25.1
 
+  hookified@1.15.1: {}
+
+  hookified@2.2.0: {}
+
   hosted-git-info@4.1.0:
     dependencies:
       lru-cache: 6.0.0
@@ -8922,8 +9152,6 @@ snapshots:
 
   jsesc@3.1.0: {}
 
-  json-buffer@3.0.1: {}
-
   json-schema-traverse@0.4.1: {}
 
   json-schema-traverse@1.0.0: {}
@@ -8987,9 +9215,9 @@ snapshots:
       prebuild-install: 7.1.3
     optional: true
 
-  keyv@4.5.4:
+  keyv@5.6.0:
     dependencies:
-      json-buffer: 3.0.1
+      '@keyv/serialize': 1.1.1
 
   leven@3.1.0: {}
 
@@ -9129,6 +9357,10 @@ snapshots:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
+  magic-string@1.2.3:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+
   magicast@0.5.4:
     dependencies:
       '@babel/parser': 7.29.8
@@ -9281,16 +9513,16 @@ snapshots:
 
   mdurl@2.1.0: {}
 
-  memfs@4.68.1:
+  memfs@4.71.0:
     dependencies:
-      '@jsonjoy.com/fs-core': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-fsa': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-builtins': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-to-fsa': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-node-utils': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-print': 4.68.1(tslib@2.8.1)
-      '@jsonjoy.com/fs-snapshot': 4.68.1(tslib@2.8.1)
+      '@jsonjoy.com/fs-core': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-fsa': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-builtins': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-to-fsa': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-node-utils': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-print': 4.71.0(tslib@2.8.1)
+      '@jsonjoy.com/fs-snapshot': 4.71.0(tslib@2.8.1)
       '@jsonjoy.com/json-pack': 1.21.0(tslib@2.8.1)
       '@jsonjoy.com/util': 1.9.0(tslib@2.8.1)
       glob-to-regex.js: 1.2.0(tslib@2.8.1)
@@ -9850,7 +10082,7 @@ snapshots:
 
   prettier@3.9.6: {}
 
-  pretty-bytes@7.1.1: {}
+  pretty-bytes@7.1.3: {}
 
   pretty-format@27.5.1:
     dependencies:
@@ -9904,6 +10136,10 @@ snapshots:
 
   pvutils@1.2.0: {}
 
+  qified@0.10.1:
+    dependencies:
+      hookified: 2.2.0
+
   qs@6.15.3:
     dependencies:
       es-define-property: 1.0.1
@@ -10266,13 +10502,17 @@ snapshots:
 
   stdin-discarder@0.2.2: {}
 
-  storybook@10.5.10(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6):
+  storybook-addon-pseudo-states@10.6.0(storybook@10.6.0):
+    dependencies:
+      storybook: 10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6)
+
+  storybook@10.6.0(@types/react@19.2.18)(bufferutil@4.1.0)(prettier@3.9.6)(react@19.2.8)(utf-8-validate@6.0.6):
     dependencies:
       '@storybook/global': 5.0.0
       '@storybook/icons': 2.1.0(react@19.2.8)
       '@testing-library/dom': 10.4.1
       '@testing-library/jest-dom': 6.9.1
-      '@testing-library/user-event': 14.6.6(@testing-library/dom@10.4.1)
+      '@testing-library/user-event': 14.6.7(@testing-library/dom@10.4.1)
       '@vitest/expect': 3.2.4
       '@vitest/spy': 3.2.4
       '@webcontainer/env': 1.1.1
@@ -10509,13 +10749,13 @@ snapshots:
       tunnel: 0.0.6
       underscore: 1.13.8
 
-  typescript-eslint@8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3):
+  typescript-eslint@8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3):
     dependencies:
-      '@typescript-eslint/eslint-plugin': 8.67.0(@typescript-eslint/parser@8.67.0)(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/parser': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/typescript-estree': 8.67.0(supports-color@8.1.1)(typescript@6.0.3)
-      '@typescript-eslint/utils': 8.67.0(eslint@10.9.0)(supports-color@8.1.1)(typescript@6.0.3)
-      eslint: 10.9.0(supports-color@8.1.1)
+      '@typescript-eslint/eslint-plugin': 8.70.0(@typescript-eslint/parser@8.70.0)(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/parser': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/typescript-estree': 8.70.0(supports-color@8.1.1)(typescript@6.0.3)
+      '@typescript-eslint/utils': 8.70.0(eslint@10.10.0)(supports-color@8.1.1)(typescript@6.0.3)
+      eslint: 10.10.0(supports-color@8.1.1)
       typescript: 6.0.3
     transitivePeerDependencies:
       - supports-color
@@ -10837,12 +11077,12 @@ snapshots:
 
   yocto-queue@0.1.0: {}
 
-  zod-validation-error@4.0.2(zod@4.4.3):
+  zod-validation-error@4.0.2(zod@4.5.4):
     dependencies:
-      zod: 4.4.3
+      zod: 4.5.4
 
   zod@3.23.8: {}
 
-  zod@4.4.3: {}
+  zod@4.5.4: {}
 
   zwitch@2.0.4: {}
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index 839ba3e17d..bd253f45b1 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -3,14 +3,15 @@ packages:
 
 catalog:
   "@rolldown/plugin-babel": ^0.2.3
-  "@storybook/addon-a11y": ^10.5.10
-  "@storybook/addon-docs": ^10.5.10
-  "@storybook/react-vite": ^10.5.10
-  "@tanstack/react-query": ^5.102.2
+  "@storybook/addon-a11y": ^10.6.0
+  "@storybook/addon-docs": ^10.6.0
+  "@storybook/react-vite": ^10.6.0
+  "@tanstack/react-query": ^5.102.8
+  "@testing-library/user-event": ^14.6.7
   "@types/react": ^19.2.18
-  "@types/react-dom": ^19.2.5
+  "@types/react-dom": ^19.2.7
   "@types/vscode-webview": ^1.57.5
-  "@vitejs/plugin-react": ^6.1.0
+  "@vitejs/plugin-react": ^6.1.1
   "@vscode-elements/react-elements": ^2.4.0
   "@vscode/codicons": 0.0.46-24
   babel-plugin-react-compiler: ^1.0.0
@@ -18,7 +19,8 @@ catalog:
   date-fns: ^4.4.0
   react: ^19.2.8
   react-dom: ^19.2.8
-  storybook: ^10.5.10
+  storybook: ^10.6.0
+  storybook-addon-pseudo-states: ^10.6.0
   typescript: ^6.0.3
   vite: ^8.2.2
 
diff --git a/src/api/agentMetadataHelper.ts b/src/api/agentMetadataHelper.ts
index dfdf7d41f2..b296d327ae 100644
--- a/src/api/agentMetadataHelper.ts
+++ b/src/api/agentMetadataHelper.ts
@@ -6,13 +6,22 @@ import {
 	AgentMetadataEventSchemaArray,
 	errToStr,
 } from "./api-helper";
-import { type CoderApi } from "./coderApi";
+
+import type { UnidirectionalStream } from "../websocket/eventStreamConnection";
+
+export interface AgentMetadataClient {
+	watchAgentMetadata(
+		agentId: string,
+	): Promise<UnidirectionalStream<{ data: unknown }>>;
+}
 
 export interface AgentMetadataWatcher {
-	onChange: vscode.EventEmitter<null>["event"];
-	dispose: () => void;
+	readonly onChange: vscode.EventEmitter<null>["event"];
+	readonly dispose: () => void;
 	metadata?: AgentMetadataEvent[];
 	error?: unknown;
+	/** True once the socket closed on its own, so it reports nothing more. */
+	closed: boolean;
 }
 
 /**
@@ -21,7 +30,7 @@ export interface AgentMetadataWatcher {
  */
 export async function createAgentMetadataWatcher(
 	agentId: WorkspaceAgent["id"],
-	client: CoderApi,
+	client: AgentMetadataClient,
 ): Promise<AgentMetadataWatcher> {
 	const socket = await client.watchAgentMetadata(agentId);
 
@@ -29,10 +38,13 @@ export async function createAgentMetadataWatcher(
 	const onChange = new vscode.EventEmitter<null>();
 	const watcher: AgentMetadataWatcher = {
 		onChange: onChange.event,
+		closed: false,
 		dispose: () => {
 			if (!disposed) {
-				socket.close();
 				disposed = true;
+				// Listeners go first, so closing the socket reports nothing more.
+				onChange.dispose();
+				socket.close();
 			}
 		},
 	};
@@ -70,6 +82,7 @@ export async function createAgentMetadataWatcher(
 	socket.addEventListener("error", handleError);
 
 	socket.addEventListener("close", (event) => {
+		watcher.closed = true;
 		if (event.code !== 1000) {
 			handleError(
 				new Error(
diff --git a/src/api/api-helper.ts b/src/api/api-helper.ts
index e1f504302c..6a2d7c6b7c 100644
--- a/src/api/api-helper.ts
+++ b/src/api/api-helper.ts
@@ -1,5 +1,6 @@
 import { isApiError, isApiErrorResponse } from "coder/site/src/api/errors";
 import {
+	type User,
 	type Workspace,
 	type WorkspaceAgent,
 	type WorkspaceResource,
@@ -27,6 +28,11 @@ export function errToStr(error: unknown, def = "No error message provided") {
 	return def;
 }
 
+/** True when the user holds the deployment-wide owner role. */
+export function isOwner(user: User | undefined): boolean {
+	return user?.roles.some((role) => role.name === "owner") ?? false;
+}
+
 /**
  * Create workspace owner/name identifier
  */
diff --git a/src/commands.ts b/src/commands.ts
index 8f9268b6d5..3ce889b52e 100644
--- a/src/commands.ts
+++ b/src/commands.ts
@@ -43,7 +43,7 @@ import {
 	RECOMMENDED_SSH_SETTINGS,
 	applySettingOverrides,
 } from "./remote/sshOverrides";
-import { resolveCliAuth } from "./settings/cli";
+import { isKeyringEnabled, resolveCliAuth } from "./settings/cli";
 import { appendVsCodeLogs } from "./supportBundle/appendVsCodeLogs";
 import {
 	getRemoteServerDataPath,
@@ -75,12 +75,14 @@ import type {
 	WorkspaceAgent,
 } from "coder/site/src/api/typesGenerated";
 
+import type { DashboardPage } from "@repo/shared";
+
 import type { CoderApi } from "./api/coderApi";
 import type { CliManager } from "./core/cliManager";
 import type { ServiceContainer } from "./core/container";
 import type { MementoManager } from "./core/mementoManager";
 import type { PathResolver } from "./core/pathResolver";
-import type { SecretsManager } from "./core/secretsManager";
+import type { SecretsManager, SessionAuth } from "./core/secretsManager";
 import type { DeploymentManager } from "./deployment/deploymentManager";
 import type { Logger } from "./logging/logger";
 import type { LoginCoordinator, LoginMethod } from "./login/loginCoordinator";
@@ -696,24 +698,41 @@ export class Commands {
 	}
 
 	private async performLogout(): Promise<AuthLogoutOutcome> {
-		if (!this.deploymentManager.isAuthenticated()) {
+		const deployment = this.deploymentManager.getCurrentDeployment();
+		if (!this.deploymentManager.isAuthenticated() || !deployment) {
 			return { success: false, reason: "not_authenticated" };
 		}
 
-		this.logger.debug("Logging out");
+		const auth = await this.secretsManager.getSessionAuth(
+			deployment.safeHostname,
+		);
+		const signOutCli = await this.askSignOutCli(auth);
+		if (signOutCli === undefined) {
+			return { success: false, reason: "user_dismissed" };
+		}
+		// Another window may have switched deployments while the prompt was open.
+		if (this.deploymentManager.getCurrentDeployment()?.url !== deployment.url) {
+			return { success: false, reason: "not_authenticated" };
+		}
 
-		const deployment = this.deploymentManager.getCurrentDeployment();
+		this.logger.debug("Logging out");
 		await this.deploymentManager.clearDeployment("logout");
-
-		if (deployment) {
-			const cleared = await this.cliManager.clearCredentials(deployment.url);
-			await this.secretsManager.clearAllAuthData(deployment.safeHostname);
-			if (!cleared) {
-				vscode.window.showWarningMessage(
+		const cleared = await this.cliManager.clearCredentials(deployment.url, {
+			signOutCli,
+		});
+		await this.secretsManager.clearAllAuthData(deployment.safeHostname);
+		if (!cleared) {
+			vscode.window
+				.showWarningMessage(
 					'You\'ve been logged out of Coder, but some credentials could not be removed. Log out again to retry, or run "coder logout" in a terminal.',
-				);
-				return { success: false, reason: "cleanup_incomplete" };
-			}
+					"Show Output",
+				)
+				.then((action) => {
+					if (action === "Show Output") {
+						this.logger.show();
+					}
+				});
+			return { success: false, reason: "cleanup_incomplete" };
 		}
 
 		this.showLogoutMessage();
@@ -733,6 +752,36 @@ export class Commands {
 			});
 	}
 
+	/** Whether to sign the CLI out too. Asks when it holds this session's token; undefined when dismissed. */
+	private async askSignOutCli(
+		auth: SessionAuth | undefined,
+	): Promise<boolean | undefined> {
+		if (
+			!auth?.token ||
+			!(await this.cliManager.holdsToken(auth.url, auth.token))
+		) {
+			return false;
+		}
+		// The CLI cannot refresh an OAuth token and logout revokes it, so there is nothing to keep.
+		if (auth.oauth) {
+			return true;
+		}
+		const action = await vscodeProposed.window.showWarningMessage(
+			"Sign out of the Coder CLI too?",
+			{
+				useCustom: true,
+				modal: true,
+				detail: `${auth.url}\n\nThe Coder CLI is signed in with this session. Signing it out also signs out other tools that rely on it.`,
+			},
+			"Sign Out",
+			"Keep Signed In",
+		);
+		if (action === undefined) {
+			return undefined;
+		}
+		return action === "Sign Out";
+	}
+
 	/**
 	 * Switch to a different deployment without clearing credentials.
 	 * If login fails or user cancels, stays on current deployment.
@@ -788,7 +837,11 @@ export class Commands {
 				const selectedHostname = selected.hostnames[0];
 				const auth = await this.secretsManager.getSessionAuth(selectedHostname);
 				if (auth?.url) {
-					await this.cliManager.clearCredentials(auth.url);
+					const signOutCli = await this.askSignOutCli(auth);
+					if (signOutCli === undefined) {
+						return;
+					}
+					await this.cliManager.clearCredentials(auth.url, { signOutCli });
 				}
 				await this.secretsManager.clearAllAuthData(selectedHostname);
 				this.logger.info("Removed credentials for", selectedHostname);
@@ -801,20 +854,24 @@ export class Commands {
 					{
 						useCustom: true,
 						modal: true,
-						detail: `This will remove credentials for: ${selected.hostnames.join(", ")}\n\nYou'll need to log in again to access them.`,
+						detail: `This will remove credentials for: ${selected.hostnames.join(", ")}\n\nYou'll need to log in again to access them.${isKeyringEnabled(vscode.workspace.getConfiguration()) ? " This also signs the Coder CLI out where it shares a session." : ""}`,
 					},
 					"Remove All",
 				);
 				if (confirm === "Remove All") {
-					await Promise.all(
-						selected.hostnames.map(async (h) => {
-							const auth = await this.secretsManager.getSessionAuth(h);
-							if (auth?.url) {
-								await this.cliManager.clearCredentials(auth.url);
-							}
-							await this.secretsManager.clearAllAuthData(h);
-						}),
-					);
+					// One at a time: `coder logout` rewrites the whole keyring entry.
+					for (const h of selected.hostnames) {
+						const auth = await this.secretsManager.getSessionAuth(h);
+						if (auth?.url) {
+							await this.cliManager.clearCredentials(auth.url, {
+								signOutCli: await this.cliManager.holdsToken(
+									auth.url,
+									auth.token,
+								),
+							});
+						}
+						await this.secretsManager.clearAllAuthData(h);
+					}
 					this.logger.info(
 						"Removed credentials for all deployments:",
 						selected.hostnames.join(", "),
@@ -900,8 +957,7 @@ export class Commands {
 	 */
 	public async navigateToWorkspace(item?: OpenableTreeItem) {
 		if (item) {
-			const workspaceId = createWorkspaceIdentifier(item.workspace);
-			await openInBrowser(this.requireExtensionBaseUrl(), `/@${workspaceId}`);
+			await this.openWorkspaceInDashboard(item.workspace, "workspace");
 		} else if (this.workspace && this.remoteWorkspaceClient) {
 			await openInBrowser(
 				this.requireRemoteBaseUrl(),
@@ -922,11 +978,7 @@ export class Commands {
 	 */
 	public async navigateToWorkspaceSettings(item?: OpenableTreeItem) {
 		if (item) {
-			const workspaceId = createWorkspaceIdentifier(item.workspace);
-			await openInBrowser(
-				this.requireExtensionBaseUrl(),
-				`/@${workspaceId}/settings`,
-			);
+			await this.openWorkspaceInDashboard(item.workspace, "settings");
 		} else if (this.workspace && this.remoteWorkspaceClient) {
 			await openInBrowser(
 				this.requireRemoteBaseUrl(),
@@ -937,6 +989,21 @@ export class Commands {
 		}
 	}
 
+	/**
+	 * Open a page of a workspace in the Coder dashboard. The workspace must
+	 * belong to the currently logged-in deployment.
+	 */
+	public async openWorkspaceInDashboard(
+		workspace: Workspace,
+		page: DashboardPage,
+	): Promise<void> {
+		const workspaceId = createWorkspaceIdentifier(workspace);
+		await openInBrowser(
+			this.requireExtensionBaseUrl(),
+			`/@${workspaceId}${page === "settings" ? "/settings" : ""}`,
+		);
+	}
+
 	/**
 	 * Open a workspace or agent that is showing in the sidebar.
 	 *
@@ -946,23 +1013,12 @@ export class Commands {
 	 * Throw if not logged into a deployment.
 	 */
 	public async openFromSidebar(item: OpenableTreeItem): Promise<void> {
-		if (item) {
-			const baseUrl = this.requireExtensionBaseUrl();
-			if (item instanceof AgentTreeItem) {
-				await this.workspaceOpenTelemetry.traceOpen(
-					"sidebar_agent",
-					{ workspace: item.workspace, agent: item.agent },
-					(telemetry) => this.runOpenAgentItem(baseUrl, item, telemetry),
-				);
-			} else if (item instanceof WorkspaceTreeItem) {
-				await this.workspaceOpenTelemetry.traceOpen(
-					"sidebar_workspace",
-					{ workspace: item.workspace },
-					(telemetry) => this.runOpenWorkspaceItem(baseUrl, item, telemetry),
-				);
-			} else {
-				throw new TypeError("Unable to open unknown sidebar item");
-			}
+		if (item instanceof AgentTreeItem) {
+			await this.openWorkspaceFromSidebar(item.workspace, item.agent);
+		} else if (item instanceof WorkspaceTreeItem) {
+			await this.openWorkspaceFromSidebar(item.workspace);
+		} else if (item) {
+			throw new TypeError("Unable to open unknown sidebar item");
 		} else {
 			// If there is no tree item, then the user manually ran this command.
 			// Default to the regular open instead.
@@ -970,40 +1026,58 @@ export class Commands {
 		}
 	}
 
+	/**
+	 * Open a workspace, or one of its agents, that the sidebar lists.
+	 *
+	 * Throws if not logged into a deployment.
+	 */
+	public async openWorkspaceFromSidebar(
+		workspace: Workspace,
+		agent?: WorkspaceAgent,
+	): Promise<void> {
+		const baseUrl = this.requireExtensionBaseUrl();
+		if (agent) {
+			await this.workspaceOpenTelemetry.traceOpen(
+				"sidebar_agent",
+				{ workspace, agent },
+				(telemetry) =>
+					this.runOpenAgentItem(baseUrl, workspace, agent, telemetry),
+			);
+		} else {
+			await this.workspaceOpenTelemetry.traceOpen(
+				"sidebar_workspace",
+				{ workspace },
+				(telemetry) => this.runOpenWorkspaceItem(baseUrl, workspace, telemetry),
+			);
+		}
+	}
+
 	private async runOpenAgentItem(
 		baseUrl: string,
-		item: AgentTreeItem,
+		workspace: Workspace,
+		agent: WorkspaceAgent,
 		telemetry: WorkspaceOpenTrace,
 	): Promise<boolean> {
-		const result = await this.openWorkspace(
-			baseUrl,
-			item.workspace,
-			item.agent,
-			{
-				openRecent: true,
-			},
-		);
-		return recordOpenResult(
-			telemetry,
-			{ workspace: item.workspace, agent: item.agent },
-			result,
-		);
+		const result = await this.openWorkspace(baseUrl, workspace, agent, {
+			openRecent: true,
+		});
+		return recordOpenResult(telemetry, { workspace, agent }, result);
 	}
 
 	private async runOpenWorkspaceItem(
 		baseUrl: string,
-		item: WorkspaceTreeItem,
+		workspace: Workspace,
 		telemetry: WorkspaceOpenTrace,
 	): Promise<boolean> {
-		const agents = await this.extractAgentsWithFallback(item.workspace);
+		const agents = await this.extractAgentsWithFallback(workspace);
 		const agent = await maybeAskAgent(agents);
 		if (!agent) {
-			telemetry.abort("agent_picker", { workspace: item.workspace });
+			telemetry.abort("agent_picker", { workspace });
 			return false;
 		}
-		const selection = { workspace: item.workspace, agent };
+		const selection = { workspace, agent };
 		telemetry.select(selection);
-		const result = await this.openWorkspace(baseUrl, item.workspace, agent, {
+		const result = await this.openWorkspace(baseUrl, workspace, agent, {
 			openRecent: true,
 		});
 		return recordOpenResult(telemetry, selection, result);
@@ -1391,12 +1465,9 @@ export class Commands {
 			throw new Error("You are not logged in");
 		}
 		const safeHost = toSafeHost(baseUrl);
-		let binary: string;
-		try {
-			binary = await this.cliManager.locateBinary(baseUrl);
-		} catch {
-			binary = await this.cliManager.fetchBinary(client);
-		}
+		const binary =
+			(await this.cliManager.locateBinary(baseUrl)) ??
+			(await this.cliManager.fetchBinary(client));
 		const version = semver.parse(await cliExec.version(binary));
 		const featureSet = featureSetForVersion(version);
 		const configDir = this.pathResolver.getGlobalConfigDir(safeHost);
diff --git a/src/core/cliCredentialManager.ts b/src/core/cliCredentialManager.ts
index f6299f58fc..bfcdb0d13a 100644
--- a/src/core/cliCredentialManager.ts
+++ b/src/core/cliCredentialManager.ts
@@ -1,17 +1,22 @@
 import { execFile } from "node:child_process";
 import fs from "node:fs/promises";
-import os from "node:os";
 import { promisify } from "node:util";
 import * as semver from "semver";
 
 import { isAbortError } from "../error/errorUtils";
 import { featureSetForVersion, type FeatureSet } from "../featureSet";
 import {
+	categorizeCredentialError,
 	CredentialCliError,
 	CredentialTelemetry,
 } from "../instrumentation/credentials";
-import { getGlobalFlags, isKeyringEnabled } from "../settings/cli";
-import { getHeaderArgs } from "../settings/headers";
+import { recordError } from "../instrumentation/outcomes";
+import {
+	type CliAuth,
+	getGlobalFlags,
+	mayUseCliStore,
+	resolveCliAuth,
+} from "../settings/cli";
 import { type TelemetryReporter } from "../telemetry/reporter";
 import { toSafeHost } from "../util/uri";
 
@@ -26,39 +31,22 @@ import type { PathResolver } from "./pathResolver";
 
 const execFileAsync = promisify(execFile);
 
-// keyring uses the CLI's default store; cli-file passes --global-config.
-type CliTransport =
-	| { kind: "keyring"; binPath: string }
-	| { kind: "cli-file"; binPath: string; allowOverride: boolean };
-
-type ReadTransport = CliTransport | { kind: "none" };
-
-export interface CliCredential {
-	token: string;
-	source: "keyring" | "files";
-}
-
 const EXEC_TIMEOUT_MS = 60_000;
 const EXEC_LOG_INTERVAL_MS = 5_000;
 
-/**
- * Resolves a CLI binary path for a given deployment URL, fetching/downloading
- * if needed. Returns the path or throws if unavailable.
- */
-export type BinaryResolver = (deploymentUrl: string) => Promise<string>;
-
-/**
- * Returns true on platforms where the OS keyring is supported (macOS, Windows).
- */
-export function isKeyringSupported(): boolean {
-	const platform = os.platform();
-	return platform === "darwin" || platform === "win32";
+interface ResolvedCli {
+	binPath: string;
+	featureSet: FeatureSet;
+	auth: CliAuth;
+	flags: string[];
 }
 
-/**
- * Delegates credential storage to the Coder CLI, both keyring-backed and
- * file-based, via `coder login`/`coder logout`.
- */
+/** The downloaded CLI binary for a deployment URL, or undefined when there is none. */
+export type BinaryResolver = (
+	deploymentUrl: string,
+) => Promise<string | undefined>;
+
+/** Stores, reads, and deletes credentials through `coder login` and `coder logout`. */
 export class CliCredentialManager {
 	private readonly credentialTelemetry: CredentialTelemetry;
 
@@ -71,10 +59,7 @@ export class CliCredentialManager {
 		this.credentialTelemetry = new CredentialTelemetry(telemetry);
 	}
 
-	/**
-	 * Store credentials via `coder login` (keyring or file-backed). Throws if the
-	 * CLI binary cannot be resolved.
-	 */
+	/** Stores a token via `coder login`. Skipped until the CLI is downloaded; throws when the CLI fails. */
 	public storeToken(
 		url: string,
 		token: string,
@@ -82,243 +67,190 @@ export class CliCredentialManager {
 		options?: { signal?: AbortSignal },
 	): Promise<void> {
 		return this.credentialTelemetry.traceStore(configs, async (span) => {
-			const transport = await this.resolveWriteTransport(url, configs);
-			span.setProperty(
-				"category",
-				transport.kind === "keyring" ? "keyring" : "file",
-			);
-			await this.cliLogin(transport, url, token, configs, options);
+			const cli = await this.resolveCli(url, configs);
+			if (!cli) {
+				span.setProperty("outcome", "no_binary");
+				this.logger.info(
+					"Skipped storing the token in the CLI: it is not downloaded yet",
+				);
+				return;
+			}
+			span.setProperty("store", cli.auth.store);
+			await this.exec(cli, ["login", "--use-token-as-session", url], {
+				env: { ...process.env, CODER_SESSION_TOKEN: token },
+				signal: options?.signal,
+			});
+			span.setProperty("outcome", "stored");
+			this.logger.info("Stored token via CLI for", url);
 		});
 	}
 
-	private async cliLogin(
-		transport: CliTransport,
+	/** Reads the CLI's token via `coder login token` (CLI 2.32+). Undefined on any failure. */
+	public async readToken(
 		url: string,
-		token: string,
 		configs: Pick<WorkspaceConfiguration, "get">,
 		options?: { signal?: AbortSignal },
-	): Promise<void> {
-		const args = [
-			...this.credentialGlobalFlags(transport, url, configs),
-			"login",
-			"--use-token-as-session",
-			url,
-		];
+	): Promise<string | undefined> {
 		try {
-			await this.execWithTimeout(transport.binPath, args, {
-				env: { ...process.env, CODER_SESSION_TOKEN: token },
-				signal: options?.signal,
-			});
-			this.logger.info("Stored token via CLI for", url);
+			const cli = await this.resolveCli(url, configs);
+			if (!cli) {
+				return undefined;
+			}
+			if (!cli.featureSet.tokenRead) {
+				return undefined;
+			}
+			return await this.cliToken(cli, options?.signal);
 		} catch (error) {
-			this.logger.warn("Failed to store token via CLI:", error);
 			if (isAbortError(error)) {
 				throw error;
 			}
-			throw new CredentialCliError(error);
+			this.logger.info(
+				"Could not read the CLI session (it may not be signed in):",
+				error,
+			);
+			return undefined;
 		}
 	}
 
+	/** True when the CLI is downloaded and settings allow its own store. Otherwise reads and token checks have nothing to do. */
+	public async hasCliStore(
+		url: string,
+		configs: Pick<WorkspaceConfiguration, "get">,
+	): Promise<boolean> {
+		return (
+			mayUseCliStore(configs) && (await this.resolveBinary(url)) !== undefined
+		);
+	}
+
 	/**
-	 * Read a token via `coder login token` (keyring or file-backed). Requires
-	 * 2.31.0+; older deployments return undefined. Returns the token and its
-	 * source, or undefined on any failure. Throws AbortError on abort.
+	 * True when the CLI's own store holds `token`. Below CLI 2.32 the token
+	 * cannot be read back, so the CLI's store counts as holding it. False without a working CLI.
 	 */
-	public async readToken(
+	public async holdsToken(
 		url: string,
+		token: string,
 		configs: Pick<WorkspaceConfiguration, "get">,
 		options?: { signal?: AbortSignal },
-	): Promise<CliCredential | undefined> {
-		const transport = await this.resolveReadTransport(url, configs);
-		if (transport.kind === "none") {
-			return undefined;
-		}
-		const args = [
-			...this.credentialGlobalFlags(transport, url, configs),
-			"login",
-			"token",
-			"--url",
-			url,
-		];
-		const token = await this.runTokenRead(transport.binPath, args, options);
-		if (!token) {
-			return undefined;
+	): Promise<boolean> {
+		try {
+			const cli = await this.resolveCli(url, configs);
+			if (cli?.auth.store !== "cli") {
+				return false;
+			}
+			return (
+				!cli.featureSet.tokenRead ||
+				(await this.cliToken(cli, options?.signal)) === token
+			);
+		} catch (error) {
+			this.logger.warn("Could not read the CLI session:", error);
+			return false;
 		}
-		return {
-			token,
-			source: transport.kind === "keyring" ? "keyring" : "files",
-		};
 	}
 
-	private async runTokenRead(
-		binPath: string,
-		args: string[],
-		options?: { signal?: AbortSignal },
+	private async cliToken(
+		cli: ResolvedCli,
+		signal?: AbortSignal,
 	): Promise<string | undefined> {
-		try {
-			const { stdout } = await this.execWithTimeout(binPath, args, {
-				signal: options?.signal,
-			});
-			return nonEmpty(stdout);
-		} catch (error) {
-			if (isAbortError(error)) {
-				throw error;
-			}
-			this.logger.warn("Failed to read token via CLI:", error);
-			return undefined;
-		}
+		const { stdout } = await this.exec(cli, ["login", "token"], { signal });
+		return stdout.trim() || undefined;
 	}
 
 	/**
-	 * Delete credentials for a deployment. Removes the default-dir files and
-	 * logs out of the active store (keyring or file via --global-config).
-	 * Returns whether every store was cleared instead of throwing, except
-	 * for AbortError when the signal is aborted.
+	 * Deletes the extension's credential files and runs `coder logout`, which
+	 * revokes the token. A shared CLI session is only logged out when
+	 * `signOutCli` is set. Returns whether every store was cleared; throws only on abort.
 	 */
 	public deleteToken(
 		url: string,
 		configs: Pick<WorkspaceConfiguration, "get">,
-		options?: { signal?: AbortSignal },
+		options: { signal?: AbortSignal; signOutCli: boolean },
 	): Promise<boolean> {
 		return this.credentialTelemetry.traceClear(configs, async (span) => {
 			const [filesCleared, cliCleared] = await Promise.all([
 				this.deleteCredentialFiles(url),
-				this.cliLogout(url, configs, { signal: options?.signal, span }),
+				this.cliLogout(url, configs, { ...options, span }),
 			]);
 			return filesCleared && cliCleared;
 		});
 	}
 
-	/**
-	 * Log out via `coder logout`, keyring or file (--global-config). Records
-	 * failures on the span instead of throwing (except on abort) and returns
-	 * whether the logout succeeded.
-	 */
 	private async cliLogout(
 		url: string,
 		configs: Pick<WorkspaceConfiguration, "get">,
-		{ signal, span }: { signal?: AbortSignal; span: Span },
+		{
+			signal,
+			signOutCli,
+			span,
+		}: { signal?: AbortSignal; signOutCli: boolean; span: Span },
 	): Promise<boolean> {
-		let transport: CliTransport;
-		try {
-			transport = await this.resolveWriteTransport(url, configs);
-		} catch (error) {
-			this.logger.warn("Could not resolve CLI binary for logout:", error);
-			span.setProperty("error.type", "binary");
-			span.markError();
-			return false;
-		}
-		const args = [
-			...this.credentialGlobalFlags(transport, url, configs),
-			"logout",
-			"--url",
-			url,
-			"--yes",
-		];
 		try {
-			await this.execWithTimeout(transport.binPath, args, { signal });
-			this.logger.info("Deleted token via CLI for", url);
+			const cli = await this.resolveCli(url, configs);
+			if (!cli) {
+				span.setProperty("outcome", "no_binary");
+				this.logger.info("Skipped signing out the CLI: it is not downloaded");
+				return true;
+			}
+			span.setProperty("store", cli.auth.store);
+			// The CLI's own session is the user's call; the extension's is always revoked.
+			if (cli.auth.store === "cli" && !signOutCli) {
+				span.setProperty("outcome", "kept");
+				return true;
+			}
+			await this.exec(cli, ["logout", "--yes"], { signal });
+			span.setProperty("outcome", "logged_out");
+			this.logger.info("Logged out via CLI for", url);
 			return true;
 		} catch (error) {
 			if (isAbortError(error)) {
 				throw error;
 			}
-			this.logger.warn("Failed to delete token via CLI:", error);
-			span.setProperty("error.type", "cli");
-			span.markError();
+			this.logger.warn("Failed to log out via CLI:", error);
+			recordError(span, categorizeCredentialError(error));
 			return false;
 		}
 	}
 
-	/** Resolve the CLI binary and its feature set, or throw if unavailable. */
 	private async resolveCli(
 		url: string,
-	): Promise<{ binPath: string; featureSet: FeatureSet }> {
-		const binPath = await this.resolveBinary(url);
-		return { binPath, featureSet: await this.getFeatureSet(binPath) };
-	}
-
-	private async resolveWriteTransport(
-		url: string,
 		configs: Pick<WorkspaceConfiguration, "get">,
-	): Promise<CliTransport> {
-		const cli = await this.resolveCli(url);
-		if (isKeyringEnabled(configs) && cli.featureSet.keyringAuth) {
-			return { kind: "keyring", binPath: cli.binPath };
-		}
-		return cliFileTransport(cli);
-	}
-
-	private async resolveReadTransport(
-		url: string,
-		configs: Pick<WorkspaceConfiguration, "get">,
-	): Promise<ReadTransport> {
-		// Reading is best-effort: a missing binary means no CLI credentials.
-		const cli = await this.resolveCli(url).catch((error) => {
-			this.logger.warn("Could not resolve CLI binary:", error);
+	): Promise<ResolvedCli | undefined> {
+		const binPath = await this.resolveBinary(url);
+		if (!binPath) {
 			return undefined;
-		});
-		if (!cli) {
-			return { kind: "none" };
 		}
-		if (isKeyringEnabled(configs) && cli.featureSet.keyringAuth) {
-			return cli.featureSet.tokenRead
-				? { kind: "keyring", binPath: cli.binPath }
-				: { kind: "none" };
-		}
-		if (cli.featureSet.tokenRead) {
-			return cliFileTransport(cli);
-		}
-		return { kind: "none" };
-	}
-
-	/** Keyring uses the default store; file mode passes --global-config. */
-	private credentialGlobalFlags(
-		transport: CliTransport,
-		url: string,
-		configs: Pick<WorkspaceConfiguration, "get">,
-	): string[] {
-		if (transport.kind === "keyring") {
-			return getHeaderArgs(configs);
-		}
-		return getGlobalFlags(configs, {
-			mode: "global-config",
-			configDir: this.pathResolver.getGlobalConfigDir(toSafeHost(url)),
-			allowOverride: transport.allowOverride,
-		});
-	}
-
-	private async getFeatureSet(binPath: string): Promise<FeatureSet> {
-		return featureSetForVersion(semver.parse(await version(binPath)));
+		const featureSet = featureSetForVersion(
+			semver.parse(await version(binPath)),
+		);
+		const configDir = this.pathResolver.getGlobalConfigDir(toSafeHost(url));
+		const auth = resolveCliAuth(configs, featureSet, url, configDir);
+		return { binPath, featureSet, auth, flags: getGlobalFlags(configs, auth) };
 	}
 
-	/**
-	 * Wrap execFileAsync with a 60s timeout and periodic debug logging.
-	 */
-	private async execWithTimeout(
-		binPath: string,
+	/** Runs a subcommand with a 60s timeout. Failures become `CredentialCliError`; aborts pass through. */
+	private async exec(
+		cli: ResolvedCli,
 		args: string[],
-		options: { env?: NodeJS.ProcessEnv; signal?: AbortSignal } = {},
+		options: { env?: NodeJS.ProcessEnv; signal?: AbortSignal },
 	): Promise<{ stdout: string; stderr: string }> {
-		const { signal, ...execOptions } = options;
 		const timer = setInterval(() => {
 			this.logger.debug(`CLI command still running: coder ${args[0]} ...`);
 		}, EXEC_LOG_INTERVAL_MS);
 		try {
-			return await execFileAsync(binPath, args, {
-				...execOptions,
+			return await execFileAsync(cli.binPath, [...cli.flags, ...args], {
+				...options,
 				timeout: EXEC_TIMEOUT_MS,
-				signal,
 			});
+		} catch (error) {
+			if (isAbortError(error)) {
+				throw error;
+			}
+			throw new CredentialCliError(error);
 		} finally {
 			clearInterval(timer);
 		}
 	}
 
-	/**
-	 * Delete URL and token files. Returns whether all removals succeeded;
-	 * never throws.
-	 */
+	/** Removes the url and session files. Never throws. */
 	private async deleteCredentialFiles(url: string): Promise<boolean> {
 		const safeHostname = toSafeHost(url);
 		const paths = [
@@ -339,21 +271,3 @@ export class CliCredentialManager {
 		return results.every(Boolean);
 	}
 }
-
-function cliFileTransport(cli: {
-	binPath: string;
-	featureSet: FeatureSet;
-}): CliTransport {
-	// Override applies only once read+write are CLI-mediated (2.31+), matching
-	// resolveCliAuth.
-	return {
-		kind: "cli-file",
-		binPath: cli.binPath,
-		allowOverride: cli.featureSet.tokenRead,
-	};
-}
-
-function nonEmpty(value: string): string | undefined {
-	const trimmed = value.trim();
-	return trimmed || undefined;
-}
diff --git a/src/core/cliExec.ts b/src/core/cliExec.ts
index 04df34ec13..0cad9fd0dd 100644
--- a/src/core/cliExec.ts
+++ b/src/core/cliExec.ts
@@ -1,4 +1,5 @@
 import { type ExecFileException, execFile, spawn } from "node:child_process";
+import { stat } from "node:fs/promises";
 import { promisify } from "node:util";
 import * as vscode from "vscode";
 
@@ -17,11 +18,25 @@ export interface CliEnv {
 	configs: Pick<vscode.WorkspaceConfiguration, "get">;
 }
 
+const VERSION_CACHE = new Map<string, { fileKey: string; version: string }>();
+
 /**
- * Return the version from the binary.  Throw if unable to execute the binary or
- * find the version for any reason.
+ * Return the version from the binary, cached until the file changes on disk.
+ * Throw if unable to execute the binary or find the version for any reason.
  */
 export async function version(binPath: string): Promise<string> {
+	const { mtimeNs, size } = await stat(binPath, { bigint: true });
+	const fileKey = `${mtimeNs}:${size}`;
+	const cached = VERSION_CACHE.get(binPath);
+	if (cached?.fileKey === fileKey) {
+		return cached.version;
+	}
+	const result = await readVersion(binPath);
+	VERSION_CACHE.set(binPath, { fileKey, version: result });
+	return result;
+}
+
+async function readVersion(binPath: string): Promise<string> {
 	let stdout: string;
 	try {
 		const result = await execFileAsync(binPath, [
diff --git a/src/core/cliManager.ts b/src/core/cliManager.ts
index f603910a4c..103448c42e 100644
--- a/src/core/cliManager.ts
+++ b/src/core/cliManager.ts
@@ -22,7 +22,7 @@ import {
 } from "../instrumentation/cli";
 import * as pgp from "../pgp";
 import { withCancellableProgress, withOptionalProgress } from "../progress";
-import { isKeyringEnabled } from "../settings/cli";
+import { showStoreCredentialsError } from "../util/credentials";
 import { tempFilePath } from "../util/fs";
 import { toSafeHost } from "../util/uri";
 import { vscodeProposed } from "../vscodeProposed";
@@ -70,17 +70,10 @@ export class CliManager {
 		this.cliTelemetry = new CliTelemetry(telemetry);
 	}
 
-	/**
-	 * Return the path to a cached CLI binary for a deployment URL.
-	 * Stat check only, no network, no subprocess. Throws if absent.
-	 */
-	public async locateBinary(url: string): Promise<string> {
-		const safeHostname = toSafeHost(url);
-		const resolved = await this.resolveBinaryPath(safeHostname);
-		if (resolved.source === "not_found") {
-			throw new Error(`No CLI binary found at ${resolved.binPath}`);
-		}
-		return resolved.binPath;
+	/** The cached CLI binary for a deployment URL, or undefined when none is downloaded. Stat check only. */
+	public async locateBinary(url: string): Promise<string | undefined> {
+		const resolved = await this.resolveBinaryPath(toSafeHost(url));
+		return resolved.source === "not_found" ? undefined : resolved.binPath;
 	}
 
 	/**
@@ -1041,7 +1034,7 @@ export class CliManager {
 				await this.cliCredentialManager.storeToken(url, token, configs);
 			} catch (error) {
 				trace.error(error);
-				this.handleStoreError(error);
+				this.handleStoreError(error, configs);
 			}
 			return;
 		}
@@ -1064,21 +1057,44 @@ export class CliManager {
 			return;
 		}
 		trace.error(result.error);
-		this.handleStoreError(result.error);
+		this.handleStoreError(result.error, configs);
+	}
+
+	/** True when the CLI's own store holds this token. Cancelling the check counts as false. */
+	public async holdsToken(url: string, token: string): Promise<boolean> {
+		const configs = vscode.workspace.getConfiguration();
+		if (!(await this.cliCredentialManager.hasCliStore(url, configs))) {
+			return false;
+		}
+		const result = await withCancellableProgress(
+			({ signal }) =>
+				this.cliCredentialManager.holdsToken(url, token, configs, { signal }),
+			{
+				location: vscode.ProgressLocation.Notification,
+				title: "Reading credentials from the Coder CLI",
+				cancellable: true,
+			},
+		);
+		return result.ok && result.value;
 	}
 
 	/**
-	 * Remove credentials for a deployment. Clears both file-based credentials
-	 * and keyring entries (via `coder logout`). Never throws; returns whether
-	 * every store was cleared.
+	 * Remove credentials for a deployment. `signOutCli` also logs a shared CLI
+	 * session out. Never throws; returns whether every store was cleared.
 	 */
-	public async clearCredentials(url: string): Promise<boolean> {
+	public async clearCredentials(
+		url: string,
+		{ signOutCli }: { signOutCli: boolean },
+	): Promise<boolean> {
 		const configs = vscode.workspace.getConfiguration();
 		const result = await withOptionalProgress(
 			({ signal }) =>
-				this.cliCredentialManager.deleteToken(url, configs, { signal }),
+				this.cliCredentialManager.deleteToken(url, configs, {
+					signal,
+					signOutCli,
+				}),
 			{
-				enabled: isKeyringEnabled(configs),
+				enabled: signOutCli,
 				location: vscode.ProgressLocation.Notification,
 				title: `Removing credentials for ${url}`,
 				cancellable: true,
@@ -1095,21 +1111,11 @@ export class CliManager {
 		return false;
 	}
 
-	private handleStoreError(error: unknown): void {
-		this.output.error("Failed to store credentials:", error);
-		vscode.window
-			.showErrorMessage(
-				`Failed to store credentials: ${errToStr(error)}.`,
-				"Open Settings",
-			)
-			.then((action) => {
-				if (action === "Open Settings") {
-					vscode.commands.executeCommand(
-						"workbench.action.openSettings",
-						"coder.useKeyring",
-					);
-				}
-			});
+	private handleStoreError(
+		error: unknown,
+		configs: Pick<vscode.WorkspaceConfiguration, "get">,
+	): never {
+		showStoreCredentialsError(error, configs, this.output);
 		throw error;
 	}
 }
diff --git a/src/deployment/deploymentManager.ts b/src/deployment/deploymentManager.ts
index 7c0c47e3e2..36e6fac94d 100644
--- a/src/deployment/deploymentManager.ts
+++ b/src/deployment/deploymentManager.ts
@@ -1,3 +1,4 @@
+import { isOwner } from "../api/api-helper";
 import { CoderApi } from "../api/coderApi";
 import {
 	CONFIG_CHANGE_DEBOUNCE_MS,
@@ -420,8 +421,7 @@ export class DeploymentManager implements vscode.Disposable {
 	 */
 	private updateAuthContexts(user: User | undefined): void {
 		this.contextManager.set("coder.authenticated", Boolean(user));
-		const isOwner = user?.roles.some((r) => r.name === "owner") ?? false;
-		this.contextManager.set("coder.isOwner", isOwner);
+		this.contextManager.set("coder.isOwner", isOwner(user));
 	}
 
 	/**
diff --git a/src/deployment/sessionStore.ts b/src/deployment/sessionStore.ts
index 285be815d4..5918b34de8 100644
--- a/src/deployment/sessionStore.ts
+++ b/src/deployment/sessionStore.ts
@@ -4,6 +4,17 @@ import type { User } from "coder/site/src/api/typesGenerated";
 
 import type { Deployment } from "./types";
 
+export interface SignedOutSession {
+	readonly kind: "signedOut";
+	readonly deployment: Deployment | null;
+}
+
+export interface SignedInSession {
+	readonly kind: "signedIn";
+	readonly deployment: Deployment;
+	readonly user: User;
+}
+
 /**
  * The deployment session: signed out (optionally keeping the last deployment
  * for re-login) or signed in with an authenticated user.
@@ -11,13 +22,7 @@ import type { Deployment } from "./types";
  * Every transition makes a new object, so callers can spot a change by
  * comparing identity against an earlier value.
  */
-export type SessionData =
-	| { readonly kind: "signedOut"; readonly deployment: Deployment | null }
-	| {
-			readonly kind: "signedIn";
-			readonly deployment: Deployment;
-			readonly user: User;
-	  };
+export type SessionData = SignedOutSession | SignedInSession;
 
 /**
  * Read-only session access: the current data plus change notifications.
diff --git a/src/extension.ts b/src/extension.ts
index e5733b0bb2..8506c097d5 100644
--- a/src/extension.ts
+++ b/src/extension.ts
@@ -27,11 +27,9 @@ import { getRemoteSshExtension } from "./remote/sshExtension";
 import { registerUriHandler } from "./uri/uriHandler";
 import { initVscodeProposed } from "./vscodeProposed";
 import { TasksPanelProvider } from "./webviews/tasks/tasksPanelProvider";
-import { WorkspacesPanelProvider } from "./webviews/workspaces/workspacesPanelProvider";
-import {
-	WorkspaceProvider,
-	WorkspaceQuery,
-} from "./workspace/workspacesProvider";
+import { WorkspacesPanelProvider } from "./webviews/workspaces/panelProvider";
+import { WorkspaceStore } from "./webviews/workspaces/workspaceStore";
+import { WorkspaceProvider } from "./workspace/workspacesProvider";
 
 const MY_WORKSPACES_TREE_ID = "myWorkspaces";
 const SHARED_WORKSPACES_TREE_ID = "sharedWorkspaces";
@@ -174,16 +172,15 @@ async function doActivate(
 	ctx.subscriptions.push(announcementManager);
 
 	const myWorkspacesProvider = new WorkspaceProvider(
-		WorkspaceQuery.Mine,
+		"mine",
 		client,
 		output,
 		deploymentManager.session,
-		{ refreshIntervalMs: 5_000 },
 	);
 	ctx.subscriptions.push(myWorkspacesProvider);
 
 	const allWorkspacesProvider = new WorkspaceProvider(
-		WorkspaceQuery.All,
+		"all",
 		client,
 		output,
 		deploymentManager.session,
@@ -191,7 +188,7 @@ async function doActivate(
 	ctx.subscriptions.push(allWorkspacesProvider);
 
 	const sharedWorkspacesProvider = new WorkspaceProvider(
-		WorkspaceQuery.Shared,
+		"shared",
 		client,
 		output,
 		deploymentManager.session,
@@ -302,21 +299,26 @@ async function doActivate(
 	contextManager.set("coder.workspacesPanelEnabled", workspacesPanelEnabled);
 
 	if (workspacesPanelEnabled) {
+		const workspaceStore = new WorkspaceStore(
+			client,
+			output,
+			deploymentManager.session,
+		);
 		const workspacesPanelProvider = new WorkspacesPanelProvider(
 			ctx.extensionUri,
+			workspaceStore,
+			commands,
 			output,
 		);
 
 		ctx.subscriptions.push(
+			workspaceStore,
 			workspacesPanelProvider,
 			vscode.window.registerWebviewViewProvider(
 				WorkspacesPanelProvider.viewType,
 				workspacesPanelProvider,
 				{ webviewOptions: { retainContextWhenHidden: true } },
 			),
-			secretsManager.onDidChangeCurrentDeployment(() =>
-				workspacesPanelProvider.refresh(),
-			),
 		);
 	}
 
diff --git a/src/featureSet.ts b/src/featureSet.ts
index 1f8d53e52d..0b86f03149 100644
--- a/src/featureSet.ts
+++ b/src/featureSet.ts
@@ -10,6 +10,7 @@ export interface FeatureSet {
 	tokenRead: boolean;
 	supportBundle: boolean;
 	supportBundleWorkspaceFiles: boolean;
+	allowRedirects: boolean;
 }
 
 /**
@@ -54,11 +55,13 @@ export function featureSetForVersion(
 		cliUpdate: versionAtLeast(version, "2.24.0"),
 		// Keyring-backed token storage via `coder login`
 		keyringAuth: versionAtLeast(version, "2.29.0"),
-		// `coder login token` for reading tokens (keyring or file)
-		tokenRead: versionAtLeast(version, "2.31.0"),
+		// `coder login token`; from 2.32 file mode also checks the URL it stored.
+		tokenRead: versionAtLeast(version, "2.32.0"),
 		// `coder support bundle` (officially released/unhidden in 2.10.0)
 		supportBundle: versionAtLeast(version, "2.10.0"),
 		// --workspace-file flag for `coder support bundle`
 		supportBundleWorkspaceFiles: versionAtLeast(version, "2.36.0"),
+		// --allow-redirects; from 2.38 the CLI otherwise errors on a redirected URL.
+		allowRedirects: versionAtLeast(version, "2.38.0"),
 	};
 }
diff --git a/src/instrumentation/EVENTS.md b/src/instrumentation/EVENTS.md
index ef0814813d..f42db9b421 100644
--- a/src/instrumentation/EVENTS.md
+++ b/src/instrumentation/EVENTS.md
@@ -159,19 +159,19 @@ Emitted by `AuthTelemetry`; the credential events by `CredentialTelemetry`.
 
 #### `auth.login`
 
-| Attribute    | Values                                                                                                        |
-| ------------ | ------------------------------------------------------------------------------------------------------------- |
-| `source`     | `auto_login`, `command`, `switch_deployment`, `uri`                                                           |
-| `method`     | `mtls`, `provided_token`, `stored_token`, `keyring_token`, `cli_token`, `oauth`, `unknown` (starts `unknown`) |
-| `reason`     | `user_dismissed`, `no_url_provided` (aborted logins only)                                                     |
-| `error.type` | `auth_failed`, `exception`                                                                                    |
+| Attribute    | Values                                                                                       |
+| ------------ | -------------------------------------------------------------------------------------------- |
+| `source`     | `auto_login`, `command`, `switch_deployment`, `uri`                                          |
+| `method`     | `mtls`, `provided_token`, `stored_token`, `cli_token`, `oauth`, `unknown` (starts `unknown`) |
+| `reason`     | `user_dismissed`, `no_url_provided` (aborted logins only)                                    |
+| `error.type` | `auth_failed`, `exception`                                                                   |
 
 #### `auth.logout`
 
-| Attribute    | Values                                     |
-| ------------ | ------------------------------------------ |
-| `reason`     | `not_authenticated` (aborted logouts only) |
-| `error.type` | `exception`                                |
+| Attribute    | Values                                                                             |
+| ------------ | ---------------------------------------------------------------------------------- |
+| `reason`     | `not_authenticated`, `user_dismissed`, `cleanup_incomplete` (aborted logouts only) |
+| `error.type` | `exception`                                                                        |
 
 #### `auth.login_prompted`
 
@@ -206,11 +206,12 @@ Secret-storage session read during remote setup. No custom attributes.
 
 #### `auth.credential.store` / `auth.credential.clear`
 
-| Attribute         | Values                                            |
-| ----------------- | ------------------------------------------------- |
-| `keyring_enabled` | `true`, `false` (from settings)                   |
-| `category`        | `keyring`, `file` (the storage actually involved) |
-| `error.type`      | `binary`, `cli`                                   |
+| Attribute         | Values                                                                   |
+| ----------------- | ------------------------------------------------------------------------ |
+| `keyring_enabled` | `true`, `false` (from settings)                                          |
+| `store`           | `cli` (the CLI's own store), `extension` (the extension's directory)     |
+| `outcome`         | `stored`, `no_binary` (store); `logged_out`, `kept`, `no_binary` (clear) |
+| `error.type`      | `binary`, `cli`                                                          |
 
 ### Logs
 
diff --git a/src/instrumentation/auth.ts b/src/instrumentation/auth.ts
index bc21c588ff..07d4a692d4 100644
--- a/src/instrumentation/auth.ts
+++ b/src/instrumentation/auth.ts
@@ -18,7 +18,10 @@ export type AuthLoginOutcome =
 	| { success: false; method?: LoginMethod; reason: LoginPromptReason };
 export type AuthLogoutOutcome =
 	| { success: true }
-	| { success: false; reason: "not_authenticated" | "cleanup_incomplete" };
+	| {
+			success: false;
+			reason: "not_authenticated" | "user_dismissed" | "cleanup_incomplete";
+	  };
 
 interface AuthLoginTrace {
 	setMethod: (method: LoginMethod) => void;
diff --git a/src/instrumentation/credentials.ts b/src/instrumentation/credentials.ts
index c193f0dc1f..44735397bb 100644
--- a/src/instrumentation/credentials.ts
+++ b/src/instrumentation/credentials.ts
@@ -11,11 +11,9 @@ export type CredentialErrorCategory = "binary" | "cli";
 type CredentialEvent = "auth.credential.store" | "auth.credential.clear";
 
 /**
- * Wraps credential store/clear in a span carrying `keyring_enabled`, the
- * `category` of storage involved, and an `error.type` on failure. The
- * traced operation sets `category` on the span and reports failures by
- * throwing a categorized error (store) or recording on the span (clear, which
- * is best-effort). Aborts are recorded and re-thrown so callers still unwind.
+ * Wraps credential store/clear in a span with `keyring_enabled`, the `store`
+ * once the CLI is resolved, and `error.type` on failure. Aborts are recorded
+ * and re-thrown.
  */
 export class CredentialTelemetry {
 	public constructor(private readonly telemetry: TelemetryReporter) {}
@@ -39,7 +37,6 @@ export class CredentialTelemetry {
 		configs: Pick<WorkspaceConfiguration, "get">,
 		fn: (span: Span) => Promise<T>,
 	): Promise<T> {
-		const keyringEnabled = isKeyringEnabled(configs);
 		let aborted: Error | undefined;
 		let result: T | undefined;
 		await this.telemetry.trace(
@@ -57,10 +54,7 @@ export class CredentialTelemetry {
 					throw error;
 				}
 			},
-			{
-				keyring_enabled: keyringEnabled,
-				category: keyringEnabled ? "keyring" : "file",
-			},
+			{ keyring_enabled: isKeyringEnabled(configs) },
 		);
 		if (aborted) {
 			throw aborted;
@@ -69,16 +63,22 @@ export class CredentialTelemetry {
 	}
 }
 
-function categorizeCredentialError(error: unknown): CredentialErrorCategory {
+export function categorizeCredentialError(
+	error: unknown,
+): CredentialErrorCategory {
 	if (error instanceof CredentialCliError) {
 		return "cli";
 	}
 	return "binary";
 }
 
+/** A failed CLI command, described by its stderr when it printed any. */
 export class CredentialCliError extends Error {
 	public constructor(cause: unknown) {
-		super("Credential CLI operation failed", { cause });
+		const stderr = (cause as { stderr?: string } | undefined)?.stderr?.trim();
+		const fallback =
+			cause instanceof Error ? cause.message : "The Coder CLI failed";
+		super(stderr || fallback, { cause });
 		this.name = "CredentialCliError";
 	}
 }
diff --git a/src/login/loginCoordinator.ts b/src/login/loginCoordinator.ts
index 15c4fd93f2..e8057093de 100644
--- a/src/login/loginCoordinator.ts
+++ b/src/login/loginCoordinator.ts
@@ -7,9 +7,9 @@ import { needToken } from "../api/utils";
 import { CertificateError } from "../error/certificateError";
 import { OAuthAuthorizer } from "../oauth/authorizer";
 import { buildOAuthTokenData } from "../oauth/utils";
-import { withOptionalProgress } from "../progress";
+import { withCancellableProgress } from "../progress";
 import { maybeAskAuthMethod, maybeAskUrl } from "../promptUtils";
-import { isKeyringEnabled } from "../settings/cli";
+import { showStoreCredentialsError } from "../util/credentials";
 import { isSameOrigin, openInBrowser } from "../util/uri";
 import { vscodeProposed } from "../vscodeProposed";
 
@@ -32,12 +32,7 @@ import type { Logger } from "../logging/logger";
 import type { OAuthCallback } from "../oauth/oauthCallback";
 
 export type LoginMethod =
-	| "mtls"
-	| "provided_token"
-	| "stored_token"
-	| "keyring_token"
-	| "cli_token"
-	| "oauth";
+	"mtls" | "provided_token" | "stored_token" | "cli_token" | "oauth";
 
 type LoginAttemptResult =
 	| { success: false; reason: LoginPromptReason }
@@ -197,7 +192,7 @@ export class LoginCoordinator implements vscode.Disposable {
 	}
 
 	private async persistSessionAuth(
-		result: LoginAttemptResult,
+		result: LoginResult,
 		safeHostname: string,
 		url: string,
 	): Promise<void> {
@@ -212,11 +207,12 @@ export class LoginCoordinator implements vscode.Disposable {
 			await this.mementoManager.addToUrlHistory(url);
 
 			if (result.token) {
+				const configs = vscode.workspace.getConfiguration();
 				this.cliCredentialManager
-					.storeToken(url, result.token, vscode.workspace.getConfiguration())
-					.catch((error) => {
-						this.logger.warn("Failed to store token at login:", error);
-					});
+					.storeToken(url, result.token, configs)
+					.catch((error) =>
+						showStoreCredentialsError(error, configs, this.logger),
+					);
 			}
 		}
 	}
@@ -385,9 +381,12 @@ export class LoginCoordinator implements vscode.Disposable {
 					sameOriginAuth?.token !== undefined &&
 					(await this.tryTokenAuth(client, sameOriginAuth.token, true)) ===
 						"unauthorized";
-				const confirmed = await this.confirmLinkSignIn(
+				const confirmed = await this.confirmSignIn(
 					deployment.url,
-					result.user,
+					{
+						title: "Sign in with the token from the link?",
+						detail: `The link contains a token that signs you in as "${result.user.username}"`,
+					},
 					auth && { username: auth.username, expired },
 				);
 				if (!confirmed) {
@@ -418,43 +417,54 @@ export class LoginCoordinator implements vscode.Disposable {
 		return withLoginMethod("stored_token", result);
 	}
 
-	/** CLI credentials: the OS keyring when enabled, else the config dir. */
+	/** The CLI's own session, adopted after confirmation if it is another user's. */
 	private async tryCliCredentials(
 		ctx: LoginAttemptContext,
 	): Promise<LoginResult | undefined> {
-		const { client, deployment, isAutoLogin, auth } = ctx;
+		const { client, deployment, isAutoLogin, auth, sameOriginAuth } = ctx;
 		const configs = vscode.workspace.getConfiguration();
-		const cliCredentialResult = await withOptionalProgress(
+		if (
+			!(await this.cliCredentialManager.hasCliStore(deployment.url, configs))
+		) {
+			return undefined;
+		}
+		const cliCredentialResult = await withCancellableProgress(
 			({ signal }) =>
 				this.cliCredentialManager.readToken(deployment.url, configs, {
 					signal,
 				}),
 			{
-				enabled: isKeyringEnabled(configs),
 				location: vscode.ProgressLocation.Notification,
-				title: "Reading token from OS keyring...",
+				title: "Reading credentials from the Coder CLI",
 				cancellable: true,
 			},
 		);
-		const cliCredential = cliCredentialResult.ok
+		const cliToken = cliCredentialResult.ok
 			? cliCredentialResult.value
 			: undefined;
-		if (!cliCredential || cliCredential.token === auth?.token) {
+		if (!cliToken || cliToken === auth?.token) {
 			return undefined;
 		}
 		this.logger.debug("Trying token from CLI credentials");
-		const result = await this.tryTokenAuth(
-			client,
-			cliCredential.token,
-			isAutoLogin,
-		);
+		const result = await this.tryTokenAuth(client, cliToken, isAutoLogin);
 		if (result === "unauthorized") {
 			return undefined;
 		}
-		return withLoginMethod(
-			cliCredential.source === "keyring" ? "keyring_token" : "cli_token",
-			result,
-		);
+		if (result.success && auth && auth.username !== result.user.username) {
+			const confirmed = await this.confirmSignIn(
+				deployment.url,
+				{
+					title: "Sign in with the Coder CLI's session?",
+					detail: `The Coder CLI's session signs you in as "${result.user.username}"`,
+				},
+				// A same-origin session reached this point only because it failed.
+				{ username: auth.username, expired: sameOriginAuth !== undefined },
+			);
+			if (!confirmed) {
+				return undefined;
+			}
+		}
+		return withLoginMethod("cli_token", result);
 	}
 
 	/** Last resort: ask the user how to authenticate. */
@@ -476,10 +486,10 @@ export class LoginCoordinator implements vscode.Disposable {
 		}
 	}
 
-	/** Ask before a token from a link signs the user in. */
-	private async confirmLinkSignIn(
+	/** Ask before a token the user did not enter here signs them in. */
+	private async confirmSignIn(
 		url: string,
-		user: User,
+		prompt: { title: string; detail: string },
 		previousSession:
 			{ username: string | undefined; expired: boolean } | undefined,
 	): Promise<boolean> {
@@ -490,11 +500,11 @@ export class LoginCoordinator implements vscode.Disposable {
 			? `, replacing your ${previousSession.expired ? "expired" : "current"} session${previous}`
 			: "";
 		const action = await vscodeProposed.window.showWarningMessage(
-			"Sign in with the token from the link?",
+			prompt.title,
 			{
 				useCustom: true,
 				modal: true,
-				detail: `${url}\n\nThe link contains a token that signs you in as "${user.username}"${replacing}.`,
+				detail: `${url}\n\n${prompt.detail}${replacing}.`,
 			},
 			"Sign In",
 		);
diff --git a/src/settings/cli.ts b/src/settings/cli.ts
index 4827ec75db..36f867eb8b 100644
--- a/src/settings/cli.ts
+++ b/src/settings/cli.ts
@@ -1,4 +1,5 @@
-import { isKeyringSupported } from "../core/cliCredentialManager";
+import os from "node:os";
+
 import { escapeCommandArg, escapeShellArg, expandPath } from "../util";
 
 import { getHeaderArgs } from "./headers";
@@ -7,9 +8,15 @@ import type { WorkspaceConfiguration } from "vscode";
 
 import type { FeatureSet } from "../featureSet";
 
-export type CliAuth =
-	| { mode: "global-config"; configDir: string; allowOverride: boolean }
-	| { mode: "url"; url: string };
+/** The CLI's own store (its config directory or the keyring, shared with the terminal), or a directory private to the extension. */
+export type CliAuth = {
+	url: string;
+	/** The extension follows redirects itself; from 2.38 the CLI needs the flag to match. */
+	allowRedirects: boolean;
+} & (
+	| { store: "cli"; useKeyring: boolean | undefined }
+	| { store: "extension"; configDir: string; useKeyring: false | undefined }
+);
 
 /**
  * Returns the user's `coder.globalFlags` with `expandPath` applied. For
@@ -51,28 +58,25 @@ function buildGlobalFlags(
 	escAuth: (s: string) => string,
 	escHeader: (s: string) => string,
 ): string[] {
-	const userFlags = getExpandedUserGlobalFlags(configs);
-	const headers = getHeaderArgs(configs, escHeader);
-
 	// Escape after stripping so expansion whitespace stays in one shell token.
-	const cleanUserFlags = (stripGlobalConfig: boolean) =>
-		stripManagedFlags(userFlags, stripGlobalConfig).map(escAuth);
-
-	// Keyring mode: --url auth; drop user --global-config (would force file storage).
-	if (auth.mode === "url") {
-		return [...cleanUserFlags(true), "--url", escAuth(auth.url), ...headers];
+	const flags = stripManagedFlags(
+		getExpandedUserGlobalFlags(configs),
+		auth.store === "extension",
+	).map(escAuth);
+	if (auth.store === "extension") {
+		flags.push("--global-config", escAuth(auth.configDir));
 	}
-
-	// File mode: keep the user's --global-config on 2.31+, else emit our own.
-	const honorOverride =
-		auth.allowOverride &&
-		userFlags.some((flag) => isFlag(flag, "--global-config"));
-	const authFlags = honorOverride
-		? []
-		: ["--global-config", escAuth(auth.configDir)];
-	return [...cleanUserFlags(!honorOverride), ...authFlags, ...headers];
+	flags.push("--url", escAuth(auth.url));
+	if (auth.useKeyring !== undefined) {
+		flags.push(`--use-keyring=${auth.useKeyring}`);
+	}
+	if (auth.allowRedirects) {
+		flags.push("--allow-redirects");
+	}
+	return [...flags, ...getHeaderArgs(configs, escHeader)];
 }
 
+/** Drops `--use-keyring`, and `--global-config` when the extension supplies its own. */
 function stripManagedFlags(
 	flags: string[],
 	stripGlobalConfig: boolean,
@@ -100,36 +104,55 @@ function isFlag(item: string, name: string): boolean {
 	);
 }
 
-/**
- * Returns true when the user has keyring enabled and the platform supports it.
- */
+/** True on platforms with an OS keyring the CLI supports (macOS, Windows). */
+export function isKeyringSupported(): boolean {
+	const platform = os.platform();
+	return platform === "darwin" || platform === "win32";
+}
+
+/** True when `coder.useKeyring` is on and the platform supports it. */
 export function isKeyringEnabled(
 	configs: Pick<WorkspaceConfiguration, "get">,
 ): boolean {
-	return (
-		isKeyringSupported() && configs.get<boolean>("coder.useKeyring", false)
-	);
+	return isKeyringSupported() && configs.get<boolean>("coder.useKeyring", true);
 }
 
-/**
- * Resolves how the CLI should authenticate: via the keyring (`--url`) or via
- * the global config directory (`--global-config`).
- */
+/** True when settings allow the CLI's own store: the keyring is on or a user config directory is set. `resolveCliAuth` adds the CLI version gates. */
+export function mayUseCliStore(
+	configs: Pick<WorkspaceConfiguration, "get">,
+): boolean {
+	return isKeyringEnabled(configs) || hasUserConfigDir(configs);
+}
+
+/** Uses the CLI's own store when the keyring is on or the user set a config directory. */
 export function resolveCliAuth(
 	configs: Pick<WorkspaceConfiguration, "get">,
 	featureSet: FeatureSet,
-	deploymentUrl: string,
+	url: string,
 	configDir: string,
 ): CliAuth {
-	if (isKeyringEnabled(configs) && featureSet.keyringAuth) {
-		return { mode: "url", url: deploymentUrl };
+	// Below 2.29 the CLI lacks --use-keyring.
+	const useKeyring = featureSet.keyringAuth
+		? isKeyringEnabled(configs)
+		: undefined;
+	// A user directory is honored on 2.32+, where the CLI reports its token.
+	const userDir = hasUserConfigDir(configs) && featureSet.tokenRead;
+	const common = { url, allowRedirects: featureSet.allowRedirects };
+	if (useKeyring || userDir) {
+		return { ...common, store: "cli", useKeyring };
 	}
-	// Honored only on 2.31.0+, where CLI-mediated read/write share the directory.
-	return {
-		mode: "global-config",
-		configDir,
-		allowOverride: featureSet.tokenRead,
-	};
+	return { ...common, store: "extension", configDir, useKeyring };
+}
+
+function hasUserConfigDir(
+	configs: Pick<WorkspaceConfiguration, "get">,
+): boolean {
+	return (
+		Boolean(process.env.CODER_CONFIG_DIR) ||
+		getExpandedUserGlobalFlags(configs).some((flag) =>
+			isFlag(flag, "--global-config"),
+		)
+	);
 }
 
 /**
diff --git a/src/util/credentials.ts b/src/util/credentials.ts
new file mode 100644
index 0000000000..9c53193509
--- /dev/null
+++ b/src/util/credentials.ts
@@ -0,0 +1,32 @@
+import * as vscode from "vscode";
+
+import { errToStr } from "../api/api-helper";
+import { isKeyringEnabled } from "../settings/cli";
+
+import type { WorkspaceConfiguration } from "vscode";
+
+import type { Logger } from "../logging/logger";
+
+/** Logs a failed credential store and shows an error that opens `coder.useKeyring`. */
+export function showStoreCredentialsError(
+	error: unknown,
+	configs: Pick<WorkspaceConfiguration, "get">,
+	logger: Logger,
+): void {
+	logger.error("Failed to store credentials:", error);
+	let message = `Failed to store credentials: ${errToStr(error)}.`;
+	if (isKeyringEnabled(configs)) {
+		message +=
+			' To store the token in a file instead, set "coder.useKeyring" to false.';
+	}
+	void vscode.window
+		.showErrorMessage(message, "Open Settings")
+		.then((action) => {
+			if (action === "Open Settings") {
+				void vscode.commands.executeCommand(
+					"workbench.action.openSettings",
+					"coder.useKeyring",
+				);
+			}
+		});
+}
diff --git a/src/util/poller.ts b/src/util/poller.ts
new file mode 100644
index 0000000000..2875b17e7f
--- /dev/null
+++ b/src/util/poller.ts
@@ -0,0 +1,95 @@
+import * as vscode from "vscode";
+
+import type { Logger } from "../logging/logger";
+
+/** What a task asks for once it is done. */
+export type NextRun = { readonly delayMs: number } | "retry" | "idle";
+
+export interface RetryOptions {
+	/** Delay after the first failure in a row. Each one after doubles it. */
+	readonly initialDelayMs: number;
+	readonly maxDelayMs: number;
+}
+
+/**
+ * Runs one task at a time, on the schedule the task asks for. Starting a run
+ * cancels the token of the run in flight, so a superseded task can drop what
+ * it fetched instead of publishing it.
+ */
+export class Poller implements vscode.Disposable {
+	private source: vscode.CancellationTokenSource | undefined;
+	private timer: NodeJS.Timeout | undefined;
+	private retries = 0;
+	private settledPromise = Promise.resolve();
+
+	constructor(
+		private readonly task: (
+			token: vscode.CancellationToken,
+		) => Promise<NextRun>,
+		private readonly retry: RetryOptions,
+		private readonly logger: Logger,
+	) {}
+
+	/**
+	 * The run in flight, or the last one. Never rejects: a task that throws is
+	 * logged and retried.
+	 */
+	public get settled(): Promise<void> {
+		return this.settledPromise;
+	}
+
+	/** Cancel the run in flight and run the task now, starting the backoff over. */
+	public run(): Promise<void> {
+		this.retries = 0;
+		return this.start();
+	}
+
+	public dispose(): void {
+		this.cancel();
+	}
+
+	private start(): Promise<void> {
+		this.cancel();
+		const source = new vscode.CancellationTokenSource();
+		this.source = source;
+		this.settledPromise = this.attempt(source.token).finally(() => {
+			if (this.source === source) {
+				this.source = undefined;
+			}
+			source.dispose();
+		});
+		return this.settledPromise;
+	}
+
+	private async attempt(token: vscode.CancellationToken): Promise<void> {
+		let next: NextRun;
+		try {
+			next = await this.task(token);
+		} catch (error) {
+			this.logger.error("Unexpected failure in a polled task", error);
+			next = "retry";
+		}
+		// A superseded or disposed run schedules nothing.
+		if (token.isCancellationRequested) {
+			return;
+		}
+		this.retries = next === "retry" ? this.retries + 1 : 0;
+		if (next === "idle") {
+			return;
+		}
+		const delayMs =
+			next === "retry"
+				? Math.min(
+						this.retry.initialDelayMs * 2 ** (this.retries - 1),
+						this.retry.maxDelayMs,
+					)
+				: next.delayMs;
+		this.timer = setTimeout(() => void this.start(), delayMs);
+	}
+
+	private cancel(): void {
+		clearTimeout(this.timer);
+		this.source?.cancel();
+		this.source = undefined;
+	}
+}
diff --git a/src/webviews/dispatch.ts b/src/webviews/dispatch.ts
index 3c17d27271..d097314155 100644
--- a/src/webviews/dispatch.ts
+++ b/src/webviews/dispatch.ts
@@ -6,9 +6,9 @@ import { type Logger } from "../logging/logger";
 import type { IpcRequest, IpcResponse, NotificationDef } from "@repo/shared";
 
 export interface DispatchOptions {
-	logger: Logger;
-	/** Returning true shows the handler's error via `showErrorMessage`. */
-	showErrorToUser?: (method: string) => boolean;
+	readonly logger: Logger;
+	/** Methods whose failures warrant a dialog; others are logged only. */
+	readonly userActions?: ReadonlySet<string>;
 }
 
 /** Push a typed notification to a webview. No-op when `webview` is undefined. */
@@ -73,6 +73,31 @@ export async function dispatchRequest(
 	}
 }
 
+export interface WebviewHandlers {
+	readonly requests: Readonly<
+		Record<string, (params: unknown) => Promise<unknown>>
+	>;
+	readonly commands: Readonly<
+		Record<string, (params: unknown) => void | Promise<void>>
+	>;
+}
+
+/** Route a message from a webview to its request or command handler. */
+export async function dispatchWebviewMessage(
+	message: unknown,
+	handlers: WebviewHandlers,
+	webview: vscode.Webview | undefined,
+	options: DispatchOptions,
+): Promise<void> {
+	if (isIpcRequest(message)) {
+		await dispatchRequest(message, handlers.requests, webview, options);
+	} else if (isIpcCommand(message)) {
+		await dispatchCommand(message, handlers.commands, options);
+	} else {
+		options.logger.warn("Unexpected webview message", message);
+	}
+}
+
 /** Fire `handler` on `event` only while `panel.visible` is true. */
 export function onWhileVisible<T>(
 	panel: { readonly visible: boolean },
@@ -119,7 +144,7 @@ function handleDispatchError(
 ): void {
 	const message = toError(err).message;
 	options.logger.warn(`${kind} ${method} failed`, err);
-	if (options.showErrorToUser?.(method)) {
+	if (options.userActions?.has(method)) {
 		vscode.window.showErrorMessage(message);
 	}
 }
diff --git a/src/webviews/resultPanel.ts b/src/webviews/resultPanel.ts
index 79981d203c..42d1fcb7bf 100644
--- a/src/webviews/resultPanel.ts
+++ b/src/webviews/resultPanel.ts
@@ -1,12 +1,6 @@
 import * as vscode from "vscode";
 
-import {
-	dispatchCommand,
-	dispatchRequest,
-	isIpcCommand,
-	isIpcRequest,
-	onWhileVisible,
-} from "./dispatch";
+import { dispatchWebviewMessage, onWhileVisible } from "./dispatch";
 import { getWebviewHtml } from "./html";
 import { openJsonBeside } from "./openJson";
 
@@ -90,16 +84,12 @@ export function showResultPanel(options: ResultPanelOptions): void {
 		onWhileVisible(panel, panel.onDidChangeViewState, sendData),
 		onWhileVisible(panel, vscode.window.onDidChangeActiveColorTheme, sendData),
 		panel.webview.onDidReceiveMessage((message: unknown) => {
-			if (isIpcRequest(message)) {
-				void dispatchRequest(message, requests, panel.webview, { logger });
-			} else if (isIpcCommand(message)) {
-				void dispatchCommand(message, commands, { logger });
-			} else {
-				logger.warn(
-					`Ignoring unrecognized ${webviewName} webview message`,
-					message,
-				);
-			}
+			void dispatchWebviewMessage(
+				message,
+				{ requests, commands },
+				panel.webview,
+				{ logger },
+			);
 		}),
 	];
 	panel.onDidDispose(() => {
diff --git a/src/webviews/tasks/tasksPanelProvider.ts b/src/webviews/tasks/tasksPanelProvider.ts
index 9c465583dd..b2a01dea12 100644
--- a/src/webviews/tasks/tasksPanelProvider.ts
+++ b/src/webviews/tasks/tasksPanelProvider.ts
@@ -27,13 +27,7 @@ import {
 import { type Logger } from "../../logging/logger";
 import { openInBrowser } from "../../util/uri";
 import { vscodeProposed } from "../../vscodeProposed";
-import {
-	dispatchCommand,
-	dispatchRequest,
-	isIpcCommand,
-	isIpcRequest,
-	notifyWebview,
-} from "../dispatch";
+import { dispatchWebviewMessage, notifyWebview } from "../dispatch";
 import { getWebviewHtml } from "../html";
 
 import type {
@@ -163,20 +157,16 @@ export class TasksPanelProvider
 		});
 	}
 
-	private async handleMessage(message: unknown): Promise<void> {
-		const showErrorToUser = (method: string) =>
-			TasksPanelProvider.USER_ACTION_METHODS.has(method);
-		if (isIpcRequest(message)) {
-			await dispatchRequest(message, this.requestHandlers, this.view?.webview, {
-				logger: this.logger,
-				showErrorToUser,
-			});
-		} else if (isIpcCommand(message)) {
-			await dispatchCommand(message, this.commandHandlers, {
+	private handleMessage(message: unknown): Promise<void> {
+		return dispatchWebviewMessage(
+			message,
+			{ requests: this.requestHandlers, commands: this.commandHandlers },
+			this.view?.webview,
+			{
 				logger: this.logger,
-				showErrorToUser,
-			});
-		}
+				userActions: TasksPanelProvider.USER_ACTION_METHODS,
+			},
+		);
 	}
 
 	private async handleGetTaskDetails(taskId: string): Promise<TaskDetails> {
diff --git a/src/webviews/workspaces/panelProvider.ts b/src/webviews/workspaces/panelProvider.ts
new file mode 100644
index 0000000000..f91a6b239c
--- /dev/null
+++ b/src/webviews/workspaces/panelProvider.ts
@@ -0,0 +1,166 @@
+import * as vscode from "vscode";
+
+import {
+	buildCommandHandlers,
+	WorkspacesApi,
+	type OpenWorkspaceParams,
+} from "@repo/shared";
+
+import { extractAgents } from "../../api/api-helper";
+import {
+	dispatchWebviewMessage,
+	notifyWebview,
+	type WebviewHandlers,
+} from "../dispatch";
+import { getWebviewHtml } from "../html";
+
+import type { Workspace } from "coder/site/src/api/typesGenerated";
+
+import type { Commands } from "../../commands";
+import type { Logger } from "../../logging/logger";
+
+import type { WorkspaceStore } from "./workspaceStore";
+
+/** Methods whose failures warrant a dialog; others are logged only. */
+const USER_ACTION_METHODS: ReadonlySet<string> = new Set([
+	WorkspacesApi.openWorkspace.method,
+	WorkspacesApi.viewInDashboard.method,
+]);
+
+/**
+ * Renders the workspaces of the current deployment in a webview. All state
+ * lives in the store: every change is pushed whole, and a webview that just
+ * loaded asks for it with `ready`.
+ */
+export class WorkspacesPanelProvider
+	implements vscode.WebviewViewProvider, vscode.Disposable
+{
+	public static readonly viewType = "coder.workspacesPanel";
+
+	private readonly handlers: WebviewHandlers = {
+		requests: {},
+		commands: buildCommandHandlers(WorkspacesApi, {
+			ready: () => {
+				// A webview that just loaded has nothing expanded.
+				void this.store.watchAgents([]);
+				this.pushState();
+			},
+			refresh: () => this.store.refresh(),
+			setFilter: (p) => this.store.setFilter(p.filter),
+			watchAgents: (p) => this.store.watchAgents(p.agentIds),
+			openWorkspace: (p) => this.openWorkspace(p),
+			viewInDashboard: (p) =>
+				this.commands.openWorkspaceInDashboard(
+					this.requireWorkspace(p.workspaceId),
+					p.page,
+				),
+		}),
+	};
+
+	private view: vscode.WebviewView | undefined;
+	private disposables: vscode.Disposable[] = [];
+
+	constructor(
+		private readonly extensionUri: vscode.Uri,
+		private readonly store: WorkspaceStore,
+		private readonly commands: Pick<
+			Commands,
+			"openWorkspaceFromSidebar" | "openWorkspaceInDashboard"
+		>,
+		private readonly logger: Logger,
+	) {}
+
+	resolveWebviewView(
+		webviewView: vscode.WebviewView,
+		_context: vscode.WebviewViewResolveContext,
+		token: vscode.CancellationToken,
+	): void {
+		if (token.isCancellationRequested) {
+			return;
+		}
+		// Drop the view being replaced first, so its disposal cannot reach this one.
+		this.detachView();
+		this.view = webviewView;
+
+		webviewView.webview.options = {
+			enableScripts: true,
+			localResourceRoots: [
+				vscode.Uri.joinPath(
+					this.extensionUri,
+					"dist",
+					"webviews",
+					"workspaces",
+				),
+			],
+		};
+
+		this.disposables.push(
+			this.store.onDidChange((state) => this.pushState(state)),
+			webviewView.onDidChangeVisibility(() => this.syncVisibility()),
+			webviewView.webview.onDidReceiveMessage((message: unknown) => {
+				dispatchWebviewMessage(message, this.handlers, webviewView.webview, {
+					logger: this.logger,
+					userActions: USER_ACTION_METHODS,
+				}).catch((err: unknown) => {
+					this.logger.error("Unhandled error in message handler", err);
+				});
+			}),
+			webviewView.onDidDispose(() => {
+				this.detachView();
+				this.syncVisibility();
+			}),
+		);
+
+		webviewView.webview.html = getWebviewHtml(
+			webviewView.webview,
+			this.extensionUri,
+			"workspaces",
+			"Coder Workspaces",
+		);
+
+		this.syncVisibility();
+	}
+
+	dispose(): void {
+		this.detachView();
+		this.syncVisibility();
+	}
+
+	private syncVisibility(): void {
+		void this.store.setVisible(this.view?.visible ?? false);
+	}
+
+	private pushState(state = this.store.state): void {
+		notifyWebview(this.view?.webview, WorkspacesApi.stateChanged, state);
+	}
+
+	private async openWorkspace({
+		workspaceId,
+		agentId,
+	}: OpenWorkspaceParams): Promise<void> {
+		const workspace = this.requireWorkspace(workspaceId);
+		const agent = extractAgents(workspace.latest_build.resources).find(
+			(candidate) => candidate.id === agentId,
+		);
+		if (agentId && !agent) {
+			throw new Error("Agent is no longer available");
+		}
+		await this.commands.openWorkspaceFromSidebar(workspace, agent);
+	}
+
+	private requireWorkspace(workspaceId: string): Workspace {
+		const workspace = this.store.findWorkspace(workspaceId);
+		if (!workspace) {
+			throw new Error("Workspace is no longer available");
+		}
+		return workspace;
+	}
+
+	private detachView(): void {
+		for (const disposable of this.disposables) {
+			disposable.dispose();
+		}
+		this.disposables = [];
+		this.view = undefined;
+	}
+}
diff --git a/src/webviews/workspaces/workspaceStore.ts b/src/webviews/workspaces/workspaceStore.ts
new file mode 100644
index 0000000000..f4a4f528ec
--- /dev/null
+++ b/src/webviews/workspaces/workspaceStore.ts
@@ -0,0 +1,245 @@
+import { isDeepStrictEqual } from "node:util";
+import * as vscode from "vscode";
+
+import { errToStr, extractAllAgents } from "../../api/api-helper";
+import { Poller, type NextRun, type RetryOptions } from "../../util/poller";
+import { AgentMetadataTracker } from "../../workspace/agentMetadataTracker";
+import {
+	availableFilters,
+	DEFAULT_WORKSPACE_FILTER,
+	isQueryRejected,
+	WORKSPACE_FILTERS,
+} from "../../workspace/filters";
+
+import type {
+	Workspace,
+	WorkspaceFilter,
+	WorkspaceListStatus,
+	WorkspacesState,
+} from "@repo/shared";
+
+import type { AgentMetadataClient } from "../../api/agentMetadataHelper";
+import type { CoderApi } from "../../api/coderApi";
+import type { SessionState } from "../../deployment/sessionStore";
+import type { Logger } from "../../logging/logger";
+
+interface WorkspacesClient extends AgentMetadataClient {
+	getWorkspaces(
+		request: Parameters<CoderApi["getWorkspaces"]>[0],
+	): Promise<{ readonly workspaces: readonly Workspace[] }>;
+}
+
+const RETRY: RetryOptions = { initialDelayMs: 5_000, maxDelayMs: 60_000 };
+const LOADING: WorkspaceListStatus = { kind: "loading" };
+const READY: WorkspaceListStatus = { kind: "ready" };
+
+function listedAgentIds(
+	requested: readonly string[],
+	workspaces: readonly Workspace[],
+): readonly string[] {
+	if (requested.length === 0) {
+		return [];
+	}
+	const listed = new Set(extractAllAgents(workspaces).map((agent) => agent.id));
+	return requested.filter((agentId) => listed.has(agentId));
+}
+
+/**
+ * Owns the state the Workspaces panel renders: lists the active filter while
+ * visible, watches the agents the panel is showing, and reports every change.
+ */
+export class WorkspaceStore implements vscode.Disposable {
+	private readonly changeEmitter = new vscode.EventEmitter<WorkspacesState>();
+	private readonly agents: AgentMetadataTracker;
+	private readonly poller: Poller;
+	private readonly disposables: readonly vscode.Disposable[];
+	/** Filters this deployment rejected, so they are no longer offered. */
+	private readonly unsupportedFilters = new Set<WorkspaceFilter>();
+
+	public readonly onDidChange = this.changeEmitter.event;
+
+	private filter: WorkspaceFilter = DEFAULT_WORKSPACE_FILTER;
+	private workspaces: readonly Workspace[] = [];
+	private status = LOADING;
+	/** Agents the webview is showing, listed or not. */
+	private requestedAgents: readonly string[] = [];
+	private lastEmitted: WorkspacesState | undefined;
+	private visible = false;
+	private disposed = false;
+
+	constructor(
+		private readonly client: WorkspacesClient,
+		private readonly logger: Logger,
+		private readonly sessionState: SessionState,
+	) {
+		this.agents = new AgentMetadataTracker(client);
+		this.poller = new Poller((token) => this.list(token), RETRY, logger);
+		this.disposables = [
+			this.poller,
+			this.agents,
+			this.agents.onDidChange(() => this.publish()),
+			this.sessionState.onDidChange(() => this.handleSessionChange()),
+		];
+	}
+
+	public get state(): WorkspacesState {
+		const session = this.sessionState.current;
+		return {
+			capabilities: {
+				authenticated: session.kind === "signedIn",
+				filters: availableFilters(session, this.unsupportedFilters),
+			},
+			filter: this.filter,
+			workspaces: this.workspaces,
+			status: this.status,
+			metadata: this.agents.metadata,
+		};
+	}
+
+	/** The list in flight, or the last one. Never rejects. */
+	public get settled(): Promise<void> {
+		return this.poller.settled;
+	}
+
+	public findWorkspace(workspaceId: string): Workspace | undefined {
+		return this.workspaces.find((workspace) => workspace.id === workspaceId);
+	}
+
+	/** A hidden store keeps its list and sockets; a revealed one lists again. */
+	public setVisible(visible: boolean): Promise<void> {
+		if (this.disposed || this.visible === visible) {
+			return this.settled;
+		}
+		this.visible = visible;
+		return visible ? this.poller.run() : this.settled;
+	}
+
+	public setFilter(filter: WorkspaceFilter): Promise<void> {
+		if (this.disposed || filter === this.filter) {
+			return this.settled;
+		}
+		if (!this.filters.includes(filter)) {
+			this.logger.warn(`Ignoring unavailable workspaces filter: ${filter}`);
+			return this.settled;
+		}
+		this.filter = filter;
+		return this.reload();
+	}
+
+	/** Watch exactly these agents, as far as the list has them. */
+	public watchAgents(agentIds: readonly string[]): Promise<void> {
+		this.requestedAgents = agentIds;
+		return this.watchListedAgents();
+	}
+
+	/** List now, keeping the list on show and offering rejected filters again. */
+	public refresh(): Promise<void> {
+		// A hidden panel cannot re-validate a filter it offers again.
+		if (this.disposed || !this.visible) {
+			return this.settled;
+		}
+		this.unsupportedFilters.clear();
+		return this.reload(this.workspaces);
+	}
+
+	public dispose(): void {
+		this.disposed = true;
+		for (const disposable of this.disposables) {
+			disposable.dispose();
+		}
+		this.changeEmitter.dispose();
+	}
+
+	private get filters(): readonly WorkspaceFilter[] {
+		return availableFilters(this.sessionState.current, this.unsupportedFilters);
+	}
+
+	private async list(token: vscode.CancellationToken): Promise<NextRun> {
+		if (this.disposed) {
+			return "idle";
+		}
+		const session = this.sessionState.current;
+		if (session.kind !== "signedIn") {
+			this.setList([]);
+			return "idle";
+		}
+		if (!this.visible) {
+			return "idle";
+		}
+		const { getQuery, pollIntervalMs } = WORKSPACE_FILTERS[this.filter];
+		try {
+			const { workspaces } = await this.client.getWorkspaces({
+				q: getQuery(session),
+			});
+			// Cancelled by a filter switch, a refresh, a session change, or disposal.
+			if (token.isCancellationRequested) {
+				return "idle";
+			}
+			this.setList(workspaces);
+			return this.visible && pollIntervalMs !== undefined
+				? { delayMs: pollIntervalMs }
+				: "idle";
+		} catch (error) {
+			if (token.isCancellationRequested) {
+				return "idle";
+			}
+			// The default filter's query is as old as the API; never drop it.
+			if (this.filter !== DEFAULT_WORKSPACE_FILTER && isQueryRejected(error)) {
+				this.unsupportedFilters.add(this.filter);
+				this.filter = DEFAULT_WORKSPACE_FILTER;
+				this.setList([], LOADING);
+				return this.list(token);
+			}
+			this.logger.warn("Failed to fetch workspaces:", error);
+			this.setList([], {
+				kind: "failed",
+				error: errToStr(error, "Failed to fetch workspaces"),
+			});
+			return "retry";
+		}
+	}
+
+	/** Show `workspaces` as loading, then list again. */
+	private reload(workspaces: readonly Workspace[] = []): Promise<void> {
+		this.setList(workspaces, LOADING);
+		return this.poller.run();
+	}
+
+	private setList(workspaces: readonly Workspace[], status = READY): void {
+		this.workspaces = workspaces;
+		this.status = status;
+		void this.watchListedAgents();
+		this.publish();
+	}
+
+	private watchListedAgents(): Promise<void> {
+		return this.agents
+			.watch(listedAgentIds(this.requestedAgents, this.workspaces))
+			.catch((error: unknown) => {
+				// Metadata is supplementary: never report it as a failure to list.
+				this.logger.warn("Failed to watch agent metadata:", error);
+			});
+	}
+
+	private publish(): void {
+		if (this.disposed) {
+			return;
+		}
+		const state = this.state;
+		if (!isDeepStrictEqual(state, this.lastEmitted)) {
+			this.lastEmitted = state;
+			this.changeEmitter.fire(state);
+		}
+	}
+
+	private handleSessionChange(): void {
+		this.unsupportedFilters.clear();
+		this.requestedAgents = [];
+		if (!this.filters.includes(this.filter)) {
+			this.filter = DEFAULT_WORKSPACE_FILTER;
+		}
+		void this.reload();
+		// Another session's sockets must not linger.
+		this.agents.clear();
+	}
+}
diff --git a/src/webviews/workspaces/workspacesPanelProvider.ts b/src/webviews/workspaces/workspacesPanelProvider.ts
deleted file mode 100644
index cac04d7cf6..0000000000
--- a/src/webviews/workspaces/workspacesPanelProvider.ts
+++ /dev/null
@@ -1,102 +0,0 @@
-import * as vscode from "vscode";
-
-import {
-	buildCommandHandlers,
-	buildRequestHandlers,
-	WorkspacesApi,
-} from "@repo/shared";
-
-import {
-	dispatchCommand,
-	dispatchRequest,
-	isIpcCommand,
-	isIpcRequest,
-} from "../dispatch";
-import { getWebviewHtml } from "../html";
-
-import type { Logger } from "../../logging/logger";
-
-export class WorkspacesPanelProvider
-	implements vscode.WebviewViewProvider, vscode.Disposable
-{
-	public static readonly viewType = "coder.workspacesPanel";
-
-	private view?: vscode.WebviewView;
-	private disposables: vscode.Disposable[] = [];
-
-	private readonly requestHandlers = buildRequestHandlers(WorkspacesApi, {});
-	private readonly commandHandlers = buildCommandHandlers(WorkspacesApi, {});
-
-	constructor(
-		private readonly extensionUri: vscode.Uri,
-		private readonly logger: Logger,
-	) {}
-
-	public refresh(): void {
-		this.logger.debug("Workspaces panel refresh requested");
-	}
-
-	resolveWebviewView(
-		webviewView: vscode.WebviewView,
-		_context: vscode.WebviewViewResolveContext,
-		_token: vscode.CancellationToken,
-	): void {
-		this.view = webviewView;
-
-		webviewView.webview.options = {
-			enableScripts: true,
-			localResourceRoots: [
-				vscode.Uri.joinPath(
-					this.extensionUri,
-					"dist",
-					"webviews",
-					"workspaces",
-				),
-			],
-		};
-
-		this.disposeView();
-
-		this.disposables.push(
-			webviewView.webview.onDidReceiveMessage((message: unknown) => {
-				this.handleMessage(message).catch((err: unknown) => {
-					this.logger.error("Unhandled error in message handler", err);
-				});
-			}),
-		);
-
-		webviewView.webview.html = getWebviewHtml(
-			webviewView.webview,
-			this.extensionUri,
-			"workspaces",
-			"Coder Workspaces",
-		);
-
-		webviewView.onDidDispose(() => this.disposeView());
-	}
-
-	private async handleMessage(message: unknown): Promise<void> {
-		if (isIpcRequest(message)) {
-			await dispatchRequest(message, this.requestHandlers, this.view?.webview, {
-				logger: this.logger,
-			});
-		} else if (isIpcCommand(message)) {
-			await dispatchCommand(message, this.commandHandlers, {
-				logger: this.logger,
-			});
-		} else {
-			this.logger.warn("Unexpected webview message", message);
-		}
-	}
-
-	private disposeView(): void {
-		for (const d of this.disposables) {
-			d.dispose();
-		}
-		this.disposables = [];
-	}
-
-	dispose(): void {
-		this.disposeView();
-	}
-}
diff --git a/src/workspace/agentMetadataTracker.ts b/src/workspace/agentMetadataTracker.ts
new file mode 100644
index 0000000000..fb8b83b37f
--- /dev/null
+++ b/src/workspace/agentMetadataTracker.ts
@@ -0,0 +1,179 @@
+import * as vscode from "vscode";
+
+import {
+	createAgentMetadataWatcher,
+	formatMetadataError,
+	type AgentMetadataWatcher,
+	type AgentMetadataClient,
+} from "../api/agentMetadataHelper";
+
+import type {
+	AgentMetadataMap,
+	AgentMetadataState,
+	WorkspaceAgent,
+} from "@repo/shared";
+
+type AgentId = WorkspaceAgent["id"];
+
+const PENDING: AgentMetadataState = { kind: "pending" };
+
+/** One watched agent: its socket, and what it last reported. */
+class WatchedAgent {
+	/** Pending close, set while nothing watches the agent. */
+	public linger: NodeJS.Timeout | undefined;
+	private current: AgentMetadataState = PENDING;
+	private watcher: AgentMetadataWatcher | undefined;
+	private opening: Promise<void> | undefined;
+	private closed = false;
+
+	constructor(
+		private readonly agentId: AgentId,
+		private readonly client: AgentMetadataClient,
+		private readonly onReport: (agent: WatchedAgent) => void,
+	) {}
+
+	public get state(): AgentMetadataState {
+		return this.current;
+	}
+
+	/** Open the socket unless one is open or opening. Resolves once it settled. */
+	public ensureOpen(): Promise<void> {
+		if (!this.opening && (!this.watcher || this.watcher.closed)) {
+			this.opening = this.open().finally(() => {
+				this.opening = undefined;
+			});
+		}
+		return this.opening ?? Promise.resolve();
+	}
+
+	public close(): void {
+		this.closed = true;
+		clearTimeout(this.linger);
+		this.watcher?.dispose();
+	}
+
+	private async open(): Promise<void> {
+		let watcher: AgentMetadataWatcher;
+		try {
+			watcher = await createAgentMetadataWatcher(this.agentId, this.client);
+		} catch (error) {
+			this.report({ kind: "failed", error: formatMetadataError(error) });
+			return;
+		}
+		if (this.closed) {
+			watcher.dispose();
+			return;
+		}
+		this.watcher?.dispose();
+		this.watcher = watcher;
+		watcher.onChange(() => this.reportFrom(watcher));
+		// A report may arrive before the subscription.
+		if (watcher.metadata !== undefined || watcher.error !== undefined) {
+			this.reportFrom(watcher);
+		}
+	}
+
+	private reportFrom(watcher: AgentMetadataWatcher): void {
+		this.report(
+			watcher.error === undefined
+				? { kind: "reported", metadata: watcher.metadata ?? [] }
+				: { kind: "failed", error: formatMetadataError(watcher.error) },
+		);
+	}
+
+	private report(state: AgentMetadataState): void {
+		if (!this.closed) {
+			this.current = state;
+			this.onReport(this);
+		}
+	}
+}
+
+/**
+ * Watches agent metadata over SSE. The watched set is declared, not built up:
+ * `watch` opens the sockets it is missing and releases the rest. Released
+ * sockets stay open for a while, so watching an agent again is instant.
+ */
+export class AgentMetadataTracker implements vscode.Disposable {
+	private readonly changeEmitter = new vscode.EventEmitter<void>();
+	private readonly watched = new Map<AgentId, WatchedAgent>();
+
+	public readonly onDidChange = this.changeEmitter.event;
+
+	private disposed = false;
+
+	constructor(
+		private readonly client: AgentMetadataClient,
+		/** How long a released socket stays open, in case it is wanted again. */
+		private readonly lingerMs = 15_000,
+	) {}
+
+	/** What every watched agent reports. Released agents are left out. */
+	public get metadata(): AgentMetadataMap {
+		return Object.fromEntries(
+			[...this.watched]
+				.filter(([, agent]) => !agent.linger)
+				.map(([agentId, agent]) => [agentId, agent.state]),
+		);
+	}
+
+	/**
+	 * Watch exactly `agentIds`, releasing the rest. A socket that fails to open
+	 * is reported against its agent rather than thrown; the next call retries it.
+	 */
+	public async watch(agentIds: Iterable<AgentId>): Promise<void> {
+		if (this.disposed) {
+			return;
+		}
+		const wanted = new Set(agentIds);
+		for (const [agentId, agent] of this.watched) {
+			if (wanted.has(agentId)) {
+				clearTimeout(agent.linger);
+				agent.linger = undefined;
+			} else {
+				agent.linger ??= setTimeout(() => this.close(agentId), this.lingerMs);
+			}
+		}
+		const opening = [...wanted].map((agentId) =>
+			(this.watched.get(agentId) ?? this.add(agentId)).ensureOpen(),
+		);
+		this.fire();
+		await Promise.all(opening);
+	}
+
+	/** Close every socket now, released or not. */
+	public clear(): void {
+		for (const agentId of this.watched.keys()) {
+			this.close(agentId);
+		}
+		this.fire();
+	}
+
+	public dispose(): void {
+		this.disposed = true;
+		this.clear();
+		this.changeEmitter.dispose();
+	}
+
+	private add(agentId: AgentId): WatchedAgent {
+		// A released agent's report is kept for when it is watched again.
+		const agent = new WatchedAgent(agentId, this.client, (reported) => {
+			if (!reported.linger) {
+				this.fire();
+			}
+		});
+		this.watched.set(agentId, agent);
+		return agent;
+	}
+
+	private close(agentId: AgentId): void {
+		this.watched.get(agentId)?.close();
+		this.watched.delete(agentId);
+	}
+
+	private fire(): void {
+		if (!this.disposed) {
+			this.changeEmitter.fire();
+		}
+	}
+}
diff --git a/src/workspace/filters.ts b/src/workspace/filters.ts
new file mode 100644
index 0000000000..49fd0cca6a
--- /dev/null
+++ b/src/workspace/filters.ts
@@ -0,0 +1,69 @@
+import { isAxiosError } from "axios";
+
+import { isOwner } from "../api/api-helper";
+
+import type { WorkspaceFilter } from "@repo/shared";
+
+import type { SessionData, SignedInSession } from "../deployment/sessionStore";
+
+/** How one set of workspaces is listed and shown, and who may select it. */
+export interface WorkspaceFilterConfig {
+	readonly requiresOwner: boolean;
+	/** How often to list again while showing. Absent when listed on demand. */
+	readonly pollIntervalMs?: number;
+	/** Whether listed workspaces can belong to other users. */
+	readonly showOwner: boolean;
+	/** Whether the tree watches the metadata of every listed agent. */
+	readonly showMetadata: boolean;
+	readonly getQuery: (session: SignedInSession) => string;
+}
+
+/** Keys are in display order. */
+export const WORKSPACE_FILTERS: Readonly<
+	Record<WorkspaceFilter, WorkspaceFilterConfig>
+> = {
+	mine: {
+		requiresOwner: false,
+		pollIntervalMs: 5_000,
+		showOwner: false,
+		showMetadata: true,
+		getQuery: () => "owner:me",
+	},
+	shared: {
+		requiresOwner: false,
+		showOwner: true,
+		showMetadata: false,
+		// Excludes workspaces the user owns and shared with others.
+		// Requires Coder 2.27.0+.
+		getQuery: (session) => `shared_with_user:${session.user.id}`,
+	},
+	all: {
+		requiresOwner: true,
+		showOwner: true,
+		showMetadata: false,
+		getQuery: () => "",
+	},
+};
+
+export const DEFAULT_WORKSPACE_FILTER: WorkspaceFilter = "mine";
+
+/** The filters `session` may select, minus the ones `unsupported` lists. */
+export function availableFilters(
+	session: SessionData,
+	unsupported: ReadonlySet<WorkspaceFilter>,
+): readonly WorkspaceFilter[] {
+	if (session.kind !== "signedIn") {
+		return [];
+	}
+	const owner = isOwner(session.user);
+	return (Object.keys(WORKSPACE_FILTERS) as WorkspaceFilter[]).filter(
+		(filter) =>
+			!unsupported.has(filter) &&
+			(owner || !WORKSPACE_FILTERS[filter].requiresOwner),
+	);
+}
+
+/** True when the deployment cannot run a filter's query. */
+export function isQueryRejected(error: unknown): boolean {
+	return isAxiosError(error) && error.response?.status === 400;
+}
diff --git a/src/workspace/workspacesProvider.ts b/src/workspace/workspacesProvider.ts
index b6b4e116ca..a8c203c01a 100644
--- a/src/workspace/workspacesProvider.ts
+++ b/src/workspace/workspacesProvider.ts
@@ -1,4 +1,3 @@
-import { isAxiosError } from "axios";
 import {
 	type Workspace,
 	type WorkspaceAgent,
@@ -21,45 +20,17 @@ import {
 import { type CoderApi } from "../api/coderApi";
 import { type Logger } from "../logging/logger";
 
-import type { SessionData, SessionState } from "../deployment/sessionStore";
-
-export enum WorkspaceQuery {
-	Mine = "mine",
-	All = "all",
-	Shared = "shared",
-}
-
-type SignedInSession = Extract<SessionData, { kind: "signedIn" }>;
+import {
+	isQueryRejected,
+	WORKSPACE_FILTERS,
+	type WorkspaceFilterConfig,
+} from "./filters";
 
-/** Per-view rendering behavior and search query, keyed by workspace view. */
-interface WorkspaceQueryConfig {
-	readonly showOwner: boolean;
-	readonly showMetadata: boolean;
-	readonly getQuery: (session: SignedInSession) => string;
-}
+import type { WorkspaceFilter } from "@repo/shared";
 
-const WORKSPACE_QUERY_CONFIG = {
-	[WorkspaceQuery.Mine]: {
-		showOwner: false,
-		showMetadata: true,
-		getQuery: () => "owner:me",
-	},
-	[WorkspaceQuery.All]: {
-		showOwner: true,
-		showMetadata: false,
-		getQuery: () => "",
-	},
-	[WorkspaceQuery.Shared]: {
-		showOwner: true,
-		showMetadata: false,
-		// Only workspaces shared with the user; excludes workspaces the user
-		// owns and shared with others. Requires Coder 2.27.0+.
-		getQuery: (session) => `shared_with_user:${session.user.id}`,
-	},
-} as const satisfies Record<WorkspaceQuery, WorkspaceQueryConfig>;
+import type { SessionData, SessionState } from "../deployment/sessionStore";
 
 export interface WorkspaceProviderOptions {
-	readonly refreshIntervalMs?: number;
 	/**
 	 * Called when the server rejects the workspaces query with HTTP 400,
 	 * which indicates a deployment that does not support the query filter.
@@ -85,7 +56,7 @@ export class WorkspaceProvider
 		AgentMetadataWatcher
 	>();
 	private readonly sessionChangeDisposable: vscode.Disposable;
-	private readonly config: WorkspaceQueryConfig;
+	private readonly config: WorkspaceFilterConfig;
 	private timeout: NodeJS.Timeout | undefined;
 	private fetching = false;
 	private refetchPending = false;
@@ -93,13 +64,13 @@ export class WorkspaceProvider
 	private disposed = false;
 
 	constructor(
-		private readonly getWorkspacesQuery: WorkspaceQuery,
+		filter: WorkspaceFilter,
 		private readonly client: CoderApi,
 		private readonly logger: Logger,
 		private readonly sessionState: SessionState,
 		private readonly options: WorkspaceProviderOptions = {},
 	) {
-		this.config = WORKSPACE_QUERY_CONFIG[getWorkspacesQuery];
+		this.config = WORKSPACE_FILTERS[filter];
 		this.sessionChangeDisposable = this.sessionState.onDidChange(() => {
 			this.clear();
 			void this.fetchAndRefresh();
@@ -135,7 +106,7 @@ export class WorkspaceProvider
 					this.logger.warn("Failed to fetch workspaces:", error);
 					hadError = true;
 					this.setWorkspaces([]);
-					if (isAxiosError(error) && error.response?.status === 400) {
+					if (isQueryRejected(error)) {
 						this.options.onQueryRejected?.();
 					}
 				}
@@ -258,12 +229,13 @@ export class WorkspaceProvider
 		}
 	}
 
-	/** Schedule the next poll, unless one is pending or no interval is set. */
+	/** Schedule the next poll, unless one is pending or the filter never polls. */
 	private maybeScheduleRefresh() {
-		if (this.options.refreshIntervalMs && !this.timeout) {
+		const { pollIntervalMs } = this.config;
+		if (pollIntervalMs !== undefined && !this.timeout) {
 			this.timeout = setTimeout(() => {
 				void this.fetchAndRefresh();
-			}, this.options.refreshIntervalMs);
+			}, pollIntervalMs);
 		}
 	}
 
diff --git a/test/mocks/testHelpers.ts b/test/mocks/testHelpers.ts
index 708440cbb0..9200a59705 100644
--- a/test/mocks/testHelpers.ts
+++ b/test/mocks/testHelpers.ts
@@ -10,7 +10,11 @@ import { onTestFinished, vi } from "vitest";
 import * as vscode from "vscode";
 
 import { Commands } from "@/commands";
-import { SessionStore, type SessionData } from "@/deployment/sessionStore";
+import {
+	SessionStore,
+	type SessionData,
+	type SignedInSession,
+} from "@/deployment/sessionStore";
 
 import {
 	resource as createResource,
@@ -519,6 +523,8 @@ export function createMockCliCredentialManager(): CliCredentialManager {
 		storeToken: vi.fn().mockResolvedValue(undefined),
 		readToken: vi.fn().mockResolvedValue(undefined),
 		deleteToken: vi.fn().mockResolvedValue(true),
+		holdsToken: vi.fn().mockResolvedValue(false),
+		hasCliStore: vi.fn().mockResolvedValue(true),
 	} as unknown as CliCredentialManager;
 }
 
@@ -720,6 +726,24 @@ export function setActiveColorTheme(kind: vscode.ColorThemeKind): void {
 	vscodeWindow.__setActiveColorThemeKind(kind);
 }
 
+/** A Webview that records what the extension posts to it. */
+function createMockWebview(options: vscode.WebviewOptions) {
+	const messageEmitter = new vscode.EventEmitter<unknown>();
+	const postedMessages: unknown[] = [];
+	const webview: vscode.Webview = {
+		options,
+		html: "",
+		cspSource: "mock-csp",
+		onDidReceiveMessage: messageEmitter.event,
+		postMessage: (msg: unknown) => {
+			postedMessages.push(msg);
+			return Promise.resolve(true);
+		},
+		asWebviewUri: (uri: vscode.Uri) => uri,
+	};
+	return { webview, messageEmitter, postedMessages };
+}
+
 /** Hooks to drive lifecycle and inspect messages on a mocked WebviewPanel. */
 export interface WebviewPanelTestHooks {
 	setVisible(visible: boolean): void;
@@ -746,25 +770,14 @@ export function createMockWebviewPanel(
 	const viewStateEmitter =
 		new vscode.EventEmitter<vscode.WebviewPanelOnDidChangeViewStateEvent>();
 	const disposeEmitter = new vscode.EventEmitter<void>();
-	const messageEmitter = new vscode.EventEmitter<unknown>();
+	const { webview, messageEmitter, postedMessages } = createMockWebview(
+		options ?? { enableScripts: true, localResourceRoots: [] },
+	);
 
 	const viewColumn =
 		typeof showOptions === "object" ? showOptions.viewColumn : showOptions;
-	const postedMessages: unknown[] = [];
 	let visible = true;
 
-	const webview: vscode.Webview = {
-		options: options ?? { enableScripts: true, localResourceRoots: [] },
-		html: "",
-		cspSource: "mock-csp",
-		onDidReceiveMessage: messageEmitter.event,
-		postMessage: (msg) => {
-			postedMessages.push(msg);
-			return Promise.resolve(true);
-		},
-		asWebviewUri: (uri) => uri,
-	};
-
 	const panel: vscode.WebviewPanel = {
 		viewType,
 		title,
@@ -803,6 +816,65 @@ export function createMockWebviewPanel(
 	return { panel, hooks };
 }
 
+/** Hooks to drive lifecycle and inspect messages on a mocked WebviewView. */
+export interface WebviewViewTestHooks {
+	/** Flip `view.visible` and fire `onDidChangeVisibility`. */
+	setVisible(visible: boolean): void;
+	fireDispose(): void;
+	/** Deliver a message as if the webview sent it. */
+	sendFromWebview(msg: unknown): void;
+	/** Every message the extension posted to the webview, oldest first. */
+	readonly postedMessages: readonly unknown[];
+	clearPostedMessages(): void;
+}
+
+/**
+ * Build a WebviewView for tests with real event emitters. Starts hidden
+ * unless `visible` says otherwise; drive it through the returned hooks.
+ */
+export function createMockWebviewView(
+	viewType: string,
+	options: { visible?: boolean } = {},
+): { view: vscode.WebviewView; hooks: WebviewViewTestHooks } {
+	const visibilityEmitter = new vscode.EventEmitter<void>();
+	const disposeEmitter = new vscode.EventEmitter<void>();
+	const { webview, messageEmitter, postedMessages } = createMockWebview({
+		enableScripts: false,
+		localResourceRoots: [],
+	});
+	let visible = options.visible ?? false;
+
+	const view: vscode.WebviewView = {
+		viewType,
+		webview,
+		get visible() {
+			return visible;
+		},
+		show: vi.fn(),
+		onDidChangeVisibility: visibilityEmitter.event,
+		onDidDispose: disposeEmitter.event,
+	};
+
+	const hooks: WebviewViewTestHooks = {
+		setVisible(next) {
+			visible = next;
+			visibilityEmitter.fire();
+		},
+		fireDispose() {
+			disposeEmitter.fire();
+		},
+		sendFromWebview(msg) {
+			messageEmitter.fire(msg);
+		},
+		postedMessages,
+		clearPostedMessages() {
+			postedMessages.length = 0;
+		},
+	};
+
+	return { view, hooks };
+}
+
 export function createMockStream(
 	content: string,
 	options: {
@@ -1048,6 +1120,20 @@ export function createMockUser(overrides: Partial<User> = {}): User {
 	};
 }
 
+/** A user holding `names` as their deployment-wide roles. */
+export function userWithRoles(...names: string[]): User {
+	return createMockUser({
+		roles: names.map((name) => ({ name, display_name: name })),
+	});
+}
+
+/** A session signed in to TEST_DEPLOYMENT as `user`. */
+export function signedInSession(
+	user: User = createMockUser(),
+): SignedInSession {
+	return { kind: "signedIn", deployment: TEST_DEPLOYMENT, user };
+}
+
 /**
  * Creates an AxiosError for testing.
  */
@@ -1414,6 +1500,12 @@ export class MockTerminalOutputChannel {
 /** Default user id of TestSessionStore's initial signed-in session. */
 export const TEST_CURRENT_USER_ID = "current-user";
 
+/** The deployment tests sign in to. */
+export const TEST_DEPLOYMENT: Deployment = {
+	url: "https://coder.example.com",
+	safeHostname: "coder.example.com",
+};
+
 /**
  * Real SessionStore that starts signed in as TEST_CURRENT_USER_ID, with
  * id-only sign-in/out helpers for tests that switch users.
@@ -1425,10 +1517,7 @@ export class TestSessionStore extends SessionStore {
 	}
 
 	signInAs(userId = TEST_CURRENT_USER_ID): void {
-		this.signIn(
-			{ url: "https://coder.example.com", safeHostname: "coder.example.com" },
-			createMockUser({ id: userId }),
-		);
+		this.signIn(TEST_DEPLOYMENT, createMockUser({ id: userId }));
 	}
 
 	override signOut(deployment: Deployment | null = null): SessionData {
@@ -1441,6 +1530,11 @@ interface WorkspacesResponse {
 	count: number;
 }
 
+/** A metadata socket, as MockWorkspacesClient hands one out. */
+export type MockMetadataStream = MockEventStream<{
+	data: AgentMetadataEvent[];
+}>;
+
 /**
  * Stands in for CoderApi at the boundaries WorkspaceProvider touches: the
  * workspaces query and the per-agent metadata socket. Program responses with
@@ -1448,22 +1542,30 @@ interface WorkspacesResponse {
  * tests drive the production watcher rather than a stub.
  */
 export class MockWorkspacesClient {
-	readonly metadataStreams = new Map<
-		string,
-		MockEventStream<{ data: AgentMetadataEvent[] }>
-	>();
+	readonly metadataStreams = new Map<string, MockMetadataStream>();
 
 	readonly getWorkspaces = vi.fn(
 		(_req: { q: string }): Promise<WorkspacesResponse> =>
 			Promise.resolve({ workspaces: [], count: 0 }),
 	);
 
+	readonly getHost = vi.fn((): string | undefined => TEST_DEPLOYMENT.url);
+
 	watchAgentMetadata(agentId: string) {
-		const stream = new MockEventStream<{ data: AgentMetadataEvent[] }>();
+		const stream: MockMetadataStream = new MockEventStream();
 		this.metadataStreams.set(agentId, stream);
 		return Promise.resolve(stream);
 	}
 
+	/** The socket opened for `agentId`, failing the test when there is none. */
+	metadataStream(agentId: string): MockMetadataStream {
+		const stream = this.metadataStreams.get(agentId);
+		if (!stream) {
+			throw new Error(`No metadata socket for ${agentId}`);
+		}
+		return stream;
+	}
+
 	/** Resolve the next getWorkspaces call with these workspaces. */
 	respondOnce(workspaces: readonly Workspace[]): void {
 		this.getWorkspaces.mockResolvedValueOnce({
@@ -1472,13 +1574,18 @@ export class MockWorkspacesClient {
 		});
 	}
 
-	/** Make the next getWorkspaces call hang until the returned resolve() runs. */
-	pending(): { resolve: (workspaces: readonly Workspace[]) => void } {
-		const { promise, resolve } = Promise.withResolvers<WorkspacesResponse>();
+	/** Make the next getWorkspaces call hang until the test settles it. */
+	pending(): {
+		resolve: (workspaces: readonly Workspace[]) => void;
+		reject: (error: unknown) => void;
+	} {
+		const { promise, resolve, reject } =
+			Promise.withResolvers<WorkspacesResponse>();
 		this.getWorkspaces.mockReturnValueOnce(promise);
 		return {
 			resolve: (workspaces) =>
 				resolve({ workspaces, count: workspaces.length }),
+			reject,
 		};
 	}
 }
diff --git a/test/mocks/vscode.runtime.ts b/test/mocks/vscode.runtime.ts
index d63b2efcf7..323d35fe55 100644
--- a/test/mocks/vscode.runtime.ts
+++ b/test/mocks/vscode.runtime.ts
@@ -174,6 +174,28 @@ export class EventEmitter<T> {
 	}
 }
 
+/** Mock CancellationTokenSource that matches the vscode API. */
+export class CancellationTokenSource {
+	private readonly emitter = new EventEmitter<void>();
+
+	readonly token = {
+		isCancellationRequested: false,
+		onCancellationRequested: this.emitter.event,
+	};
+
+	cancel(): void {
+		if (this.token.isCancellationRequested) {
+			return;
+		}
+		this.token.isCancellationRequested = true;
+		this.emitter.fire();
+	}
+
+	dispose(): void {
+		this.emitter.dispose();
+	}
+}
+
 const onDidChangeConfiguration = new EventEmitter<unknown>();
 const onDidChangeWorkspaceFolders = new EventEmitter<unknown>();
 const onDidChangeActiveColorTheme = new EventEmitter<unknown>();
@@ -279,6 +301,7 @@ const vscode = {
 	InputBoxValidationSeverity,
 	Uri,
 	EventEmitter,
+	CancellationTokenSource,
 	MarkdownString,
 	ThemeColor,
 	TreeItem,
diff --git a/test/tsconfig.json b/test/tsconfig.json
index 23b4b0a00e..6c1e8a50e7 100644
--- a/test/tsconfig.json
+++ b/test/tsconfig.json
@@ -16,7 +16,8 @@
 			"@repo/ui": ["../packages/ui/src/index.ts"],
 			"@repo/ui/*": ["../packages/ui/src/*"],
 			"@repo/netcheck/*": ["../packages/netcheck/src/*"],
-			"@repo/speedtest/*": ["../packages/speedtest/src/*"]
+			"@repo/speedtest/*": ["../packages/speedtest/src/*"],
+			"@repo/workspaces/*": ["../packages/workspaces/src/*"]
 		}
 	},
 	"include": [".", "../src", "../vitest.config.mts"]
diff --git a/test/unit/api/api-helper.test.ts b/test/unit/api/api-helper.test.ts
new file mode 100644
index 0000000000..e9da05929f
--- /dev/null
+++ b/test/unit/api/api-helper.test.ts
@@ -0,0 +1,21 @@
+import { describe, expect, it } from "vitest";
+
+import { isOwner } from "@/api/api-helper";
+
+import { userWithRoles } from "../../mocks/testHelpers";
+
+describe("isOwner", () => {
+	interface OwnerCase {
+		name: string;
+		roles: string[] | undefined;
+		owner: boolean;
+	}
+
+	it.each<OwnerCase>([
+		{ name: "nobody", roles: undefined, owner: false },
+		{ name: "a member", roles: ["member"], owner: false },
+		{ name: "an owner among others", roles: ["auditor", "owner"], owner: true },
+	])("is $owner for $name", ({ roles, owner }) => {
+		expect(isOwner(roles ? userWithRoles(...roles) : undefined)).toBe(owner);
+	});
+});
diff --git a/test/unit/api/workspace.test.ts b/test/unit/api/workspace.test.ts
index df55fb48ee..c4204cb5b9 100644
--- a/test/unit/api/workspace.test.ts
+++ b/test/unit/api/workspace.test.ts
@@ -31,6 +31,7 @@ const featureSet: FeatureSet = {
 	tokenRead: true,
 	supportBundle: true,
 	supportBundleWorkspaceFiles: true,
+	allowRedirects: true,
 };
 
 function mockStream(): UnidirectionalStream<unknown> {
@@ -94,7 +95,12 @@ function createUpdateCtx(
 	};
 	const ctx = {
 		restClient: restClient as unknown as Api,
-		auth: { mode: "url" as const, url: "https://test.coder.com" },
+		auth: {
+			store: "cli" as const,
+			url: "https://test.coder.com",
+			useKeyring: undefined,
+			allowRedirects: false,
+		},
 		binPath: "/usr/bin/coder",
 		workspace,
 		write: vi.fn<(data: string) => void>(),
diff --git a/test/unit/cliConfig.test.ts b/test/unit/cliConfig.test.ts
index 48c897a2d8..feef6fb630 100644
--- a/test/unit/cliConfig.test.ts
+++ b/test/unit/cliConfig.test.ts
@@ -10,6 +10,7 @@ import {
 	getGlobalShellFlags,
 	getSshFlags,
 	isKeyringEnabled,
+	mayUseCliStore,
 	resolveCliAuth,
 } from "@/settings/cli";
 
@@ -18,228 +19,157 @@ import { quoteCommand } from "../utils/platform";
 
 vi.mock("node:os");
 
-const globalConfigAuth: CliAuth = {
-	mode: "global-config",
-	configDir: "/config/dir",
-	allowOverride: true,
+const URL = "https://dev.coder.com";
+const EXT_DIR = "/config/dir";
+const USER_DIR = "/custom/coderv2";
+
+const extensionStoreAuth: CliAuth = {
+	store: "extension",
+	url: URL,
+	configDir: EXT_DIR,
+	useKeyring: undefined,
+	allowRedirects: false,
+};
+const cliStoreAuth: CliAuth = {
+	store: "cli",
+	url: URL,
+	useKeyring: undefined,
+	allowRedirects: false,
 };
 
+const EXTENSION_FLAGS = ["--global-config", EXT_DIR, "--url", URL];
+const CLI_FLAGS = ["--url", URL];
+
 describe("cliConfig", () => {
 	describe("getGlobalShellFlags", () => {
-		const urlAuth: CliAuth = { mode: "url", url: "https://dev.coder.com" };
-
 		interface AuthFlagsCase {
 			scenario: string;
 			auth: CliAuth;
-			expectedAuthFlags: string[];
+			expected: string[];
 		}
 
 		it.each<AuthFlagsCase>([
 			{
-				scenario: "global-config mode",
-				auth: globalConfigAuth,
-				expectedAuthFlags: ["--global-config", "/config/dir"],
+				scenario: "extension store",
+				auth: extensionStoreAuth,
+				expected: EXTENSION_FLAGS,
 			},
+			{ scenario: "CLI store", auth: cliStoreAuth, expected: CLI_FLAGS },
 			{
-				scenario: "url mode",
-				auth: urlAuth,
-				expectedAuthFlags: ["--url", "https://dev.coder.com"],
+				scenario: "extension store with keyring off",
+				auth: { ...extensionStoreAuth, useKeyring: false },
+				expected: [...EXTENSION_FLAGS, "--use-keyring=false"],
 			},
-		])(
-			"should return auth flags for $scenario",
-			({ auth, expectedAuthFlags }) => {
-				const config = new MockConfigurationProvider();
-				expect(getGlobalShellFlags(config, auth)).toStrictEqual(
-					expectedAuthFlags,
-				);
+			{
+				scenario: "CLI store with keyring on",
+				auth: { ...cliStoreAuth, useKeyring: true },
+				expected: [...CLI_FLAGS, "--use-keyring=true"],
 			},
-		);
+		])("emits auth flags for a $scenario", ({ auth, expected }) => {
+			const config = new MockConfigurationProvider();
+			expect(getGlobalShellFlags(config, auth)).toStrictEqual(expected);
+		});
 
-		it("should return global flags from config with auth flags appended", () => {
+		it("appends auth flags after user global flags", () => {
 			const config = new MockConfigurationProvider();
-			config.set("coder.globalFlags", [
-				"--verbose",
-				"--disable-direct-connections",
-			]);
+			config.set("coder.globalFlags", ["--verbose", "--global-configs"]);
 
-			expect(getGlobalShellFlags(config, globalConfigAuth)).toStrictEqual([
+			expect(getGlobalShellFlags(config, extensionStoreAuth)).toStrictEqual([
 				"--verbose",
-				"--disable-direct-connections",
-				"--global-config",
-				"/config/dir",
+				"--global-configs", // similar prefixes are not managed flags
+				...EXTENSION_FLAGS,
 			]);
 		});
 
-		it.each(["--use-keyring", "--use-keyring=false", "--use-keyring=true"])(
-			"should filter %s from global flags",
-			(managedFlag) => {
-				const config = new MockConfigurationProvider();
-				config.set("coder.globalFlags", [
-					"--verbose",
-					managedFlag,
-					"--disable-direct-connections",
-				]);
+		it("strips a user --use-keyring flag", () => {
+			const config = new MockConfigurationProvider();
+			config.set("coder.globalFlags", ["--verbose", "--use-keyring=false"]);
 
-				expect(getGlobalShellFlags(config, globalConfigAuth)).toStrictEqual([
-					"--verbose",
-					"--disable-direct-connections",
-					"--global-config",
-					"/config/dir",
-				]);
-			},
-		);
+			expect(getGlobalShellFlags(config, extensionStoreAuth)).toStrictEqual([
+				"--verbose",
+				...EXTENSION_FLAGS,
+			]);
+		});
 
-		interface GlobalConfigCase {
-			scenario: string;
-			flags: string[];
-			expected: string[];
-		}
-		it.each<GlobalConfigCase>([
-			{
-				scenario: "equals form",
-				flags: ["-v", "--global-config=/custom/coderv2"],
-				expected: ["-v", "--global-config=/custom/coderv2"],
-			},
+		const userGlobalConfigCases = [
+			{ scenario: "equals form", flags: ["-v", `--global-config=${USER_DIR}`] },
 			{
 				scenario: "separate items",
-				flags: ["-v", "--global-config", "/custom/coderv2"],
-				expected: ["-v", "--global-config", "/custom/coderv2"],
+				flags: ["-v", "--global-config", USER_DIR],
 			},
-		])(
-			"passes user --global-config through in file mode and drops our default ($scenario)",
-			({ flags, expected }) => {
+		];
+
+		it.each(userGlobalConfigCases)(
+			"passes user --global-config through in the CLI store ($scenario)",
+			({ flags }) => {
 				const config = new MockConfigurationProvider();
 				config.set("coder.globalFlags", flags);
 
-				expect(getGlobalShellFlags(config, globalConfigAuth)).toStrictEqual(
-					expected,
-				);
+				expect(getGlobalShellFlags(config, cliStoreAuth)).toStrictEqual([
+					...flags,
+					...CLI_FLAGS,
+				]);
 			},
 		);
 
 		it.each([
-			{ scenario: "space-separated in one item", flag: "--global-config /x" },
-			{ scenario: "equals form", flag: "--global-config=/x" },
+			...userGlobalConfigCases,
+			{
+				scenario: "space-separated in one item",
+				flags: ["-v", `--global-config ${USER_DIR}`],
+			},
 		])(
-			"strips user --global-config in keyring (url) mode ($scenario)",
-			({ flag }) => {
-				const urlAuth: CliAuth = { mode: "url", url: "https://dev.coder.com" };
+			"strips user --global-config in the extension store ($scenario)",
+			({ flags }) => {
 				const config = new MockConfigurationProvider();
-				config.set("coder.globalFlags", ["-v", flag]);
+				config.set("coder.globalFlags", flags);
 
-				expect(getGlobalShellFlags(config, urlAuth)).toStrictEqual([
+				expect(getGlobalShellFlags(config, extensionStoreAuth)).toStrictEqual([
 					"-v",
-					"--url",
-					"https://dev.coder.com",
+					...EXTENSION_FLAGS,
 				]);
 			},
 		);
 
-		it("strips user --global-config (separate items) in keyring (url) mode", () => {
-			const urlAuth: CliAuth = { mode: "url", url: "https://dev.coder.com" };
+		it("keeps user header-command items and appends the setting", () => {
+			const headerCommand = "echo test";
 			const config = new MockConfigurationProvider();
-			config.set("coder.globalFlags", ["-v", "--global-config", "/x"]);
+			config.set("coder.headerCommand", headerCommand);
+			config.set("coder.globalFlags", ["-v", "--header-command custom"]);
 
-			expect(getGlobalShellFlags(config, urlAuth)).toStrictEqual([
+			expect(getGlobalShellFlags(config, cliStoreAuth)).toStrictEqual([
 				"-v",
-				"--url",
-				"https://dev.coder.com",
-			]);
-		});
-
-		it("should not filter flags with similar prefixes", () => {
-			const config = new MockConfigurationProvider();
-			config.set("coder.globalFlags", ["--global-configs", "--use-keyrings"]);
-
-			expect(getGlobalShellFlags(config, globalConfigAuth)).toStrictEqual([
-				"--global-configs",
-				"--use-keyrings",
-				"--global-config",
-				"/config/dir",
+				'"--header-command custom"', // ignored by CLI
+				...CLI_FLAGS,
+				"--header-command",
+				quoteCommand(headerCommand),
 			]);
 		});
 
-		it.each<AuthFlagsCase>([
-			{
-				scenario: "global-config mode",
-				auth: globalConfigAuth,
-				expectedAuthFlags: ["--global-config", "/config/dir"],
-			},
-			{
-				scenario: "url mode",
-				auth: urlAuth,
-				expectedAuthFlags: ["--url", "https://dev.coder.com"],
-			},
-		])(
-			"should not filter header-command flags ($scenario)",
-			({ auth, expectedAuthFlags }) => {
-				const headerCommand = "echo test";
-				const config = new MockConfigurationProvider();
-				config.set("coder.headerCommand", headerCommand);
-				config.set("coder.globalFlags", [
-					"-v",
-					"--header-command custom",
-					"--no-feature-warning",
-				]);
-
-				expect(getGlobalShellFlags(config, auth)).toStrictEqual([
-					"-v",
-					'"--header-command custom"', // ignored by CLI
-					"--no-feature-warning",
-					...expectedAuthFlags,
-					"--header-command",
-					quoteCommand(headerCommand),
-				]);
-			},
-		);
-
 		it("quotes flags whose expanded value contains whitespace", () => {
 			vi.mocked(os.homedir).mockReturnValue("C:\\Users\\John Doe");
 			const config = new MockConfigurationProvider();
 			config.set("coder.globalFlags", ["--cfg=${userHome}/coder"]);
 
 			// Without per-entry escaping the space splits the shell command.
-			expect(getGlobalShellFlags(config, globalConfigAuth)).toStrictEqual([
+			expect(getGlobalShellFlags(config, extensionStoreAuth)).toStrictEqual([
 				'"--cfg=C:\\Users\\John Doe/coder"',
-				"--global-config",
-				"/config/dir",
+				...EXTENSION_FLAGS,
 			]);
 		});
 	});
 
 	describe("getGlobalFlags", () => {
-		const urlAuth: CliAuth = { mode: "url", url: "https://dev.coder.com" };
-
-		it("should not escape auth flags", () => {
-			const config = new MockConfigurationProvider();
-			expect(getGlobalFlags(config, globalConfigAuth)).toStrictEqual([
-				"--global-config",
-				"/config/dir",
-			]);
-			expect(getGlobalFlags(config, urlAuth)).toStrictEqual([
-				"--url",
-				"https://dev.coder.com",
-			]);
-		});
-
-		it("passes header-command value through verbatim (no shell)", () => {
+		it("passes user flags, auth flags, and header-command verbatim", () => {
 			const config = new MockConfigurationProvider();
+			config.set("coder.globalFlags", ["--verbose"]);
 			config.set("coder.headerCommand", "echo test");
-			expect(getGlobalFlags(config, globalConfigAuth)).toStrictEqual([
-				"--global-config",
-				"/config/dir",
-				"--header-command",
-				"echo test",
-			]);
-		});
 
-		it("should include user global flags", () => {
-			const config = new MockConfigurationProvider();
-			config.set("coder.globalFlags", ["--verbose"]);
-			expect(getGlobalFlags(config, globalConfigAuth)).toStrictEqual([
+			expect(getGlobalFlags(config, extensionStoreAuth)).toStrictEqual([
 				"--verbose",
-				"--global-config",
-				"/config/dir",
+				...EXTENSION_FLAGS,
+				"--header-command",
+				"echo test",
 			]);
 		});
 	});
@@ -336,18 +266,14 @@ describe("cliConfig", () => {
 	describe("isKeyringEnabled", () => {
 		interface KeyringEnabledCase {
 			platform: NodeJS.Platform;
-			useKeyring: boolean;
+			useKeyring?: boolean;
 			expected: boolean;
 		}
-		it("returns false on darwin when setting is unset (default)", () => {
-			vi.mocked(os.platform).mockReturnValue("darwin");
-			const config = new MockConfigurationProvider();
-			expect(isKeyringEnabled(config)).toBe(false);
-		});
 
 		it.each<KeyringEnabledCase>([
-			{ platform: "darwin", useKeyring: true, expected: true },
-			{ platform: "win32", useKeyring: true, expected: true },
+			{ platform: "darwin", expected: true },
+			{ platform: "win32", expected: true },
+			{ platform: "linux", expected: false },
 			{ platform: "linux", useKeyring: true, expected: false },
 			{ platform: "darwin", useKeyring: false, expected: false },
 		])(
@@ -355,126 +281,159 @@ describe("cliConfig", () => {
 			({ platform, useKeyring, expected }) => {
 				vi.mocked(os.platform).mockReturnValue(platform);
 				const config = new MockConfigurationProvider();
-				config.set("coder.useKeyring", useKeyring);
+				if (useKeyring !== undefined) {
+					config.set("coder.useKeyring", useKeyring);
+				}
 				expect(isKeyringEnabled(config)).toBe(expected);
 			},
 		);
 	});
 
-	describe("resolveCliAuth", () => {
-		it("returns url mode when keyring should be used", () => {
-			vi.mocked(os.platform).mockReturnValue("darwin");
-			const config = new MockConfigurationProvider();
-			config.set("coder.useKeyring", true);
-			const featureSet = featureSetForVersion(semver.parse("2.29.0"));
-			const auth = resolveCliAuth(
-				config,
-				featureSet,
-				"https://dev.coder.com",
-				"/config/dir",
-			);
-			expect(auth).toEqual({
-				mode: "url",
-				url: "https://dev.coder.com",
-			});
-		});
-
-		it("returns global-config mode when keyring should not be used", () => {
-			vi.mocked(os.platform).mockReturnValue("linux");
-			const config = new MockConfigurationProvider();
-			const featureSet = featureSetForVersion(semver.parse("2.29.0"));
-			const auth = resolveCliAuth(
-				config,
-				featureSet,
-				"https://dev.coder.com",
-				"/config/dir",
-			);
-			expect(auth).toEqual({
-				mode: "global-config",
-				configDir: "/config/dir",
-				// 2.29 < 2.31, so a user --global-config is not honored.
-				allowOverride: false,
-			});
-		});
+	describe("mayUseCliStore", () => {
+		interface MayUseCliStoreCase {
+			platform: NodeJS.Platform;
+			flags: string[];
+			expected: boolean;
+		}
 
-		it("uses caller-provided config directory in global-config mode", () => {
-			vi.mocked(os.platform).mockReturnValue("linux");
-			const config = new MockConfigurationProvider();
-			const featureSet = featureSetForVersion(semver.parse("2.29.0"));
-			const auth = resolveCliAuth(
-				config,
-				featureSet,
-				"https://dev.coder.com",
-				"/custom/coderv2",
-			);
+		it.each<MayUseCliStoreCase>([
+			{ platform: "linux", flags: [], expected: false },
+			{ platform: "darwin", flags: [], expected: true },
+			{
+				platform: "linux",
+				flags: [`--global-config=${USER_DIR}`],
+				expected: true,
+			},
+		])(
+			"is $expected on $platform with flags $flags",
+			({ platform, flags, expected }) => {
+				vi.mocked(os.platform).mockReturnValue(platform);
+				const config = new MockConfigurationProvider();
+				config.set("coder.globalFlags", flags);
 
-			expect(getGlobalFlags(config, auth)).toStrictEqual([
-				"--global-config",
-				"/custom/coderv2",
-			]);
-		});
+				expect(mayUseCliStore(config)).toBe(expected);
+			},
+		);
+	});
 
-		it("keeps keyring precedence over caller-provided config directory", () => {
-			vi.mocked(os.platform).mockReturnValue("darwin");
-			const config = new MockConfigurationProvider();
-			config.set("coder.useKeyring", true);
-			const featureSet = featureSetForVersion(semver.parse("2.29.0"));
-			const auth = resolveCliAuth(
-				config,
-				featureSet,
-				"https://dev.coder.com",
-				"/custom/coderv2",
-			);
+	describe("resolveCliAuth", () => {
+		function resolve(config: MockConfigurationProvider, version: string) {
+			const featureSet = featureSetForVersion(semver.parse(version));
+			return resolveCliAuth(config, featureSet, URL, EXT_DIR);
+		}
 
-			expect(getGlobalFlags(config, auth)).toStrictEqual([
-				"--url",
-				"https://dev.coder.com",
-			]);
+		beforeEach(() => {
+			vi.stubEnv("CODER_CONFIG_DIR", undefined);
 		});
 
-		it("lets globalFlags --global-config override the caller-provided directory on 2.31+", () => {
-			vi.mocked(os.platform).mockReturnValue("linux");
-			const config = new MockConfigurationProvider();
-			config.set("coder.globalFlags", [
-				"--verbose",
-				"--global-config=/custom/coderv2",
-			]);
-			const featureSet = featureSetForVersion(semver.parse("2.31.0"));
-			const auth = resolveCliAuth(
-				config,
-				featureSet,
-				"https://dev.coder.com",
-				"/default/coderv2",
-			);
-
-			// User's directory passes through; our default is dropped.
-			expect(getGlobalFlags(config, auth)).toStrictEqual([
-				"--verbose",
-				"--global-config=/custom/coderv2",
-			]);
+		afterEach(() => {
+			vi.unstubAllEnvs();
 		});
 
-		it("ignores globalFlags --global-config on deployments older than 2.31", () => {
-			vi.mocked(os.platform).mockReturnValue("linux");
+		interface ResolveCliAuthCase {
+			scenario: string;
+			platform: NodeJS.Platform;
+			override: "none" | "flag" | "env";
+			version: string;
+			expected: string[];
+		}
+
+		it.each<ResolveCliAuthCase>([
+			{
+				scenario: "uses the CLI store when keyring is enabled on 2.29+",
+				platform: "darwin",
+				override: "none",
+				version: "2.29.0",
+				expected: ["--verbose", ...CLI_FLAGS, "--use-keyring=true"],
+			},
+			{
+				scenario: "follows redirects on 2.38+",
+				platform: "darwin",
+				override: "none",
+				version: "2.38.0",
+				expected: [
+					"--verbose",
+					...CLI_FLAGS,
+					"--use-keyring=true",
+					"--allow-redirects",
+				],
+			},
+			{
+				scenario: "uses the extension directory when keyring is unsupported",
+				platform: "linux",
+				override: "none",
+				version: "2.29.0",
+				expected: ["--verbose", ...EXTENSION_FLAGS, "--use-keyring=false"],
+			},
+			{
+				scenario:
+					"omits --use-keyring below 2.29, where the CLI lacks the flag",
+				platform: "darwin",
+				override: "none",
+				version: "2.28.0",
+				expected: ["--verbose", ...EXTENSION_FLAGS],
+			},
+			{
+				scenario: "honors a globalFlags --global-config on 2.32+",
+				platform: "darwin",
+				override: "flag",
+				version: "2.32.0",
+				expected: [
+					"--verbose",
+					`--global-config=${USER_DIR}`,
+					...CLI_FLAGS,
+					"--use-keyring=true",
+				],
+			},
+			{
+				scenario: "honors CODER_CONFIG_DIR on 2.32+ by emitting no directory",
+				platform: "darwin",
+				override: "env",
+				version: "2.32.0",
+				expected: ["--verbose", ...CLI_FLAGS, "--use-keyring=true"],
+			},
+			{
+				scenario: "honors a globalFlags --global-config with keyring disabled",
+				platform: "linux",
+				override: "flag",
+				version: "2.32.0",
+				expected: [
+					"--verbose",
+					`--global-config=${USER_DIR}`,
+					...CLI_FLAGS,
+					"--use-keyring=false",
+				],
+			},
+			{
+				scenario:
+					"keeps the extension directory over a user directory below 2.32",
+				platform: "linux",
+				override: "flag",
+				version: "2.31.0",
+				expected: ["--verbose", ...EXTENSION_FLAGS, "--use-keyring=false"],
+			},
+			{
+				scenario:
+					"keeps the extension directory over CODER_CONFIG_DIR below 2.32",
+				platform: "linux",
+				override: "env",
+				version: "2.31.0",
+				expected: ["--verbose", ...EXTENSION_FLAGS, "--use-keyring=false"],
+			},
+		])("$scenario", ({ platform, override, version, expected }) => {
+			vi.mocked(os.platform).mockReturnValue(platform);
 			const config = new MockConfigurationProvider();
-			config.set("coder.globalFlags", [
-				"--verbose",
-				"--global-config=/custom/coderv2",
-			]);
-			const featureSet = featureSetForVersion(semver.parse("2.30.0"));
-			const auth = resolveCliAuth(
-				config,
-				featureSet,
-				"https://dev.coder.com",
-				"/default/coderv2",
+			const userFlags = ["--verbose"];
+			if (override === "flag") {
+				userFlags.push(`--global-config=${USER_DIR}`);
+			} else if (override === "env") {
+				vi.stubEnv("CODER_CONFIG_DIR", USER_DIR);
+			}
+			config.set("coder.globalFlags", userFlags);
+
+			expect(getGlobalFlags(config, resolve(config, version))).toStrictEqual(
+				expected,
 			);
-
-			// User override stripped; our default is used so it matches where we wrote.
-			expect(getGlobalFlags(config, auth)).toStrictEqual([
-				"--verbose",
-				"--global-config",
-				"/default/coderv2",
-			]);
 		});
 	});
 });
diff --git a/test/unit/commands.telemetry.test.ts b/test/unit/commands.telemetry.test.ts
index 17b59d6f9f..ffb0d1c892 100644
--- a/test/unit/commands.telemetry.test.ts
+++ b/test/unit/commands.telemetry.test.ts
@@ -15,7 +15,7 @@ import type { CliManager } from "@/core/cliManager";
 import type { ServiceContainer } from "@/core/container";
 import type { MementoManager } from "@/core/mementoManager";
 import type { PathResolver } from "@/core/pathResolver";
-import type { SecretsManager } from "@/core/secretsManager";
+import type { SecretsManager, SessionAuth } from "@/core/secretsManager";
 import type { DeploymentManager } from "@/deployment/deploymentManager";
 import type { Deployment } from "@/deployment/types";
 import type { LoginCoordinator, LoginResult } from "@/login/loginCoordinator";
@@ -48,6 +48,11 @@ interface SetupOptions {
 	readonly clearCredentialsResult?: boolean;
 }
 
+const TEST_SESSION: SessionAuth = {
+	url: TEST_URL,
+	token: "test-token",
+};
+
 function setup(options: SetupOptions = {}) {
 	vi.clearAllMocks();
 	const interaction = new MockUserInteraction();
@@ -83,17 +88,19 @@ function setup(options: SetupOptions = {}) {
 		clearDeployment: vi.fn(() => Promise.resolve()),
 	};
 
-	const cliManager: Pick<CliManager, "clearCredentials"> = {
+	const cliManager: Pick<CliManager, "clearCredentials" | "holdsToken"> = {
 		clearCredentials: vi.fn(() =>
 			Promise.resolve(options.clearCredentialsResult ?? true),
 		),
+		holdsToken: vi.fn(() => Promise.resolve(false)),
 	};
 
 	const secretsManager: Pick<
 		SecretsManager,
-		"getCurrentDeployment" | "clearAllAuthData"
+		"getCurrentDeployment" | "getSessionAuth" | "clearAllAuthData"
 	> = {
 		getCurrentDeployment: vi.fn(() => Promise.resolve(null)),
+		getSessionAuth: vi.fn(() => Promise.resolve(TEST_SESSION)),
 		clearAllAuthData: vi.fn(() => {
 			if (options.clearAllAuthDataError) {
 				return Promise.reject(options.clearAllAuthDataError);
@@ -258,12 +265,85 @@ describe("Commands", () => {
 			expect(mocks.deploymentManager.clearDeployment).toHaveBeenCalledWith(
 				"logout",
 			);
-			expect(mocks.cliManager.clearCredentials).toHaveBeenCalledWith(TEST_URL);
+			expect(mocks.cliManager.holdsToken).toHaveBeenCalledWith(
+				TEST_URL,
+				TEST_SESSION.token,
+			);
+			expect(mocks.cliManager.clearCredentials).toHaveBeenCalledWith(TEST_URL, {
+				signOutCli: false,
+			});
 			expect(mocks.secretsManager.clearAllAuthData).toHaveBeenCalledWith(
 				TEST_HOSTNAME,
 			);
 		});
 
+		const CLI_PROMPT = "Sign out of the Coder CLI too?";
+
+		interface PromptCase {
+			scenario: string;
+			oauth?: boolean;
+			answer?: string;
+			/** Undefined when the logout is aborted as user_dismissed. */
+			signOutCli?: boolean;
+		}
+
+		it.each<PromptCase>([
+			{
+				scenario: "keeps the CLI session on request",
+				answer: "Keep Signed In",
+				signOutCli: false,
+			},
+			{
+				scenario: "signs out the CLI on request",
+				answer: "Sign Out",
+				signOutCli: true,
+			},
+			{
+				scenario: "signs out the CLI without asking for OAuth",
+				oauth: true,
+				signOutCli: true,
+			},
+			{ scenario: "aborts when the prompt is dismissed" },
+		])(
+			"$scenario for a shared store",
+			async ({ oauth, answer, signOutCli }) => {
+				const { commands, mocks, interaction, sink } = setup({
+					authenticated: true,
+				});
+				vi.mocked(mocks.cliManager.holdsToken).mockResolvedValueOnce(true);
+				if (oauth) {
+					vi.mocked(mocks.secretsManager.getSessionAuth).mockResolvedValueOnce({
+						...TEST_SESSION,
+						oauth: { scope: "workspace:read", expiry_timestamp: 1 },
+					});
+				}
+				interaction.setResponse(CLI_PROMPT, answer);
+
+				await commands.logout();
+
+				const prompted = interaction
+					.getMessageCalls()
+					.some((call) => call.message === CLI_PROMPT);
+				expect(prompted).toBe(!oauth);
+				if (signOutCli === undefined) {
+					expect(sink.expectOne("auth.logout").properties).toMatchObject({
+						result: "aborted",
+						reason: "user_dismissed",
+					});
+					expect(
+						mocks.deploymentManager.clearDeployment,
+					).not.toHaveBeenCalled();
+					return;
+				}
+				expect(mocks.cliManager.clearCredentials).toHaveBeenCalledWith(
+					TEST_URL,
+					{
+						signOutCli,
+					},
+				);
+			},
+		);
+
 		it("records logout exceptions", async () => {
 			const { commands, sink } = setup({
 				authenticated: true,
diff --git a/test/unit/core/cliCredentialManager.test.ts b/test/unit/core/cliCredentialManager.test.ts
index e02d45f4b4..a6c5934cde 100644
--- a/test/unit/core/cliCredentialManager.test.ts
+++ b/test/unit/core/cliCredentialManager.test.ts
@@ -2,16 +2,14 @@ import { fs as memfs, vol } from "memfs";
 import { execFile } from "node:child_process";
 import * as os from "node:os";
 import path from "node:path";
-import { beforeEach, describe, expect, it, vi } from "vitest";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 
 import {
 	CliCredentialManager,
-	isKeyringSupported,
 	type BinaryResolver,
 } from "@/core/cliCredentialManager";
 import * as cliExec from "@/core/cliExec";
 import { PathResolver } from "@/core/pathResolver";
-import { isKeyringEnabled } from "@/settings/cli";
 
 import { createTestTelemetryService, TestSink } from "../../mocks/telemetry";
 import {
@@ -21,646 +19,524 @@ import {
 
 import type * as nodeFs from "node:fs";
 
-vi.mock("node:child_process", () => ({
-	execFile: vi.fn(),
-}));
+vi.mock("node:child_process", () => ({ execFile: vi.fn() }));
 
 vi.mock("node:os");
 
-vi.mock("@/settings/cli", async () => {
-	const actual =
-		await vi.importActual<typeof import("@/settings/cli")>("@/settings/cli");
-	return { ...actual, isKeyringEnabled: vi.fn().mockReturnValue(false) };
-});
-
 vi.mock("@/core/cliExec", async () => {
 	const actual =
 		await vi.importActual<typeof import("@/core/cliExec")>("@/core/cliExec");
-	return {
-		...actual,
-		version: vi.fn().mockResolvedValue("2.29.0"),
-	};
+	return { ...actual, version: vi.fn() };
 });
 
 vi.mock("fs/promises", async () => {
 	const memfs: { fs: typeof nodeFs } = await vi.importActual("memfs");
-	return {
-		...memfs.fs.promises,
-		default: memfs.fs.promises,
-	};
+	return { ...memfs.fs.promises, default: memfs.fs.promises };
 });
 
 const TEST_BIN = "/usr/bin/coder";
 const TEST_URL = "https://dev.coder.com";
-
-// promisify(execFile) always calls execFile(bin, args, opts, callback).
-// We extract the options from the third positional argument.
-interface ExecFileOptions {
+const PATH_RESOLVER = new PathResolver("/mock/base", "/mock/log");
+// Built with path.join so it matches getGlobalConfigDir on Windows too.
+const CRED_DIR = path.join("/mock/base", "dev.coder.com");
+const USER_DIR = "/custom/coderv2";
+
+const EXTENSION_FLAGS = [
+	"--global-config",
+	CRED_DIR,
+	"--url",
+	TEST_URL,
+	"--use-keyring=false",
+];
+const KEYRING_FLAGS = ["--url", TEST_URL, "--use-keyring=true"];
+const USER_DIR_FLAGS = [
+	`--global-config=${USER_DIR}`,
+	"--url",
+	TEST_URL,
+	"--use-keyring=false",
+];
+
+type ExecResult = string | Error;
+type ExecCallback = (err: Error | null, result?: { stdout: string }) => void;
+interface ExecOptions {
 	env?: NodeJS.ProcessEnv;
 	timeout?: number;
 	signal?: AbortSignal;
 }
 
-type ExecFileCallback = (
-	err: Error | null,
-	result?: { stdout: string },
-) => void;
-
-function stubExecFile(result: { stdout?: string } | { error: string }) {
+/** Answers each subcommand with stdout or a failure; "abort" waits for the signal. */
+function stubExecFile(
+	results:
+		| { login?: ExecResult; token?: ExecResult; logout?: ExecResult }
+		| "abort" = {},
+) {
 	vi.mocked(execFile).mockImplementation(((
 		_bin: string,
-		_args: string[],
-		_opts: ExecFileOptions,
-		cb: ExecFileCallback,
+		args: string[],
+		opts: ExecOptions,
+		cb: ExecCallback,
 	) => {
-		if ("error" in result) {
-			cb(new Error(result.error));
-		} else {
-			cb(null, { stdout: result.stdout ?? "" });
+		if (results === "abort") {
+			const err = new Error("The operation was aborted");
+			err.name = "AbortError";
+			if (opts.signal?.aborted) {
+				cb(err);
+			} else {
+				opts.signal?.addEventListener("abort", () => cb(err));
+			}
+			return;
 		}
-	}) as unknown as typeof execFile);
-}
-
-function stubExecFileAbortable() {
-	vi.mocked(execFile).mockImplementation(((
-		_bin: string,
-		_args: string[],
-		opts: ExecFileOptions,
-		cb: ExecFileCallback,
-	) => {
-		const err = new Error("The operation was aborted");
-		err.name = "AbortError";
-		if (opts.signal?.aborted) {
-			cb(err);
+		const result = args.includes("token")
+			? results.token
+			: args.includes("logout")
+				? results.logout
+				: results.login;
+		if (result instanceof Error) {
+			cb(result);
 		} else {
-			opts.signal?.addEventListener("abort", () => cb(err));
+			cb(null, { stdout: result ?? "" });
 		}
 	}) as unknown as typeof execFile);
 }
 
-function lastExecArgs() {
-	const [bin, args, opts] = vi.mocked(execFile).mock.calls[0] as [
-		string,
-		readonly string[],
-		ExecFileOptions,
-		...unknown[],
-	];
-	return {
-		bin,
-		args,
-		env: opts.env ?? process.env,
-		timeout: opts.timeout,
-		signal: opts.signal,
-	};
-}
-
-function successResolver(): BinaryResolver {
-	return vi.fn().mockResolvedValue(TEST_BIN);
-}
-
-function failingResolver(): BinaryResolver {
-	return vi.fn().mockRejectedValue(new Error("no binary"));
-}
+const execCalls = () =>
+	vi.mocked(execFile).mock.calls.map((call) => call[1] as string[]);
+const execOptions = () => vi.mocked(execFile).mock.calls[0][2] as ExecOptions;
 
-// Honor the defaultValue arg so getExpandedUserGlobalFlags sees [] when unset.
-const configs = {
-	get: vi.fn((_key: string, defaultValue?: unknown) => defaultValue),
-};
-
-const configWithHeaders = {
-	get: vi.fn((key: string, defaultValue?: unknown) =>
-		key === "coder.headerCommand" ? "my-header-cmd" : defaultValue,
-	),
-};
-
-// A configs that sets a user --global-config override via coder.globalFlags.
-function configWithGlobalConfig(dir: string) {
+/** A configs fake that honors defaultValue for everything but `values`. */
+function configWith(values: Record<string, unknown>) {
 	return {
 		get: vi.fn((key: string, defaultValue?: unknown) =>
-			key === "coder.globalFlags" ? [`--global-config=${dir}`] : defaultValue,
+			key in values ? values[key] : defaultValue,
 		),
 	};
 }
+const configs = configWith({});
+const userDirConfigs = configWith({
+	"coder.globalFlags": [`--global-config=${USER_DIR}`],
+});
 
-const TEST_PATH_RESOLVER = new PathResolver("/mock/base", "/mock/log");
-// Built with path.join so it matches getGlobalConfigDir on Windows too.
-const CRED_DIR = path.join("/mock/base", "dev.coder.com");
-const CUSTOM_CRED_DIR = "/custom/coderv2";
-
-function credentialPaths(dir = CRED_DIR) {
-	return {
-		url: `${dir}/url`,
-		session: `${dir}/session`,
-	};
-}
-
-function writeCredentialFiles(
-	url: string,
-	token: string,
-	dir = CRED_DIR,
-): void {
-	const paths = credentialPaths(dir);
-	vol.mkdirSync(dir, { recursive: true });
-	memfs.writeFileSync(paths.url, url);
-	memfs.writeFileSync(paths.session, token);
+function writeCredentialFiles(): void {
+	vol.mkdirSync(CRED_DIR, { recursive: true });
+	memfs.writeFileSync(`${CRED_DIR}/url`, TEST_URL);
+	memfs.writeFileSync(`${CRED_DIR}/session`, "old-token");
 }
 
-function credentialFilesExist(dir = CRED_DIR): boolean {
-	const paths = credentialPaths(dir);
-	return memfs.existsSync(paths.url) || memfs.existsSync(paths.session);
-}
+const credentialFilesExist = () =>
+	memfs.existsSync(`${CRED_DIR}/url`) ||
+	memfs.existsSync(`${CRED_DIR}/session`);
 
-function setup(resolver?: BinaryResolver) {
-	const r = resolver ?? successResolver();
+function setup(resolver: BinaryResolver = vi.fn().mockResolvedValue(TEST_BIN)) {
 	const sink = new TestSink();
-	return {
-		resolver: r,
-		sink,
-		manager: new CliCredentialManager(
-			createMockLogger(),
-			r,
-			TEST_PATH_RESOLVER,
-			createTestTelemetryService(sink),
-		),
-	};
+	const manager = new CliCredentialManager(
+		createMockLogger(),
+		resolver,
+		PATH_RESOLVER,
+		createTestTelemetryService(sink),
+	);
+	return { sink, manager };
 }
 
-describe("isKeyringSupported", () => {
-	it.each([
-		{ platform: "darwin", expected: true },
-		{ platform: "win32", expected: true },
-		{ platform: "linux", expected: false },
-		{ platform: "freebsd", expected: false },
-	])("returns $expected for $platform", ({ platform, expected }) => {
-		vi.mocked(os.platform).mockReturnValue(platform as NodeJS.Platform);
-		expect(isKeyringSupported()).toBe(expected);
-	});
-});
-
 describe("CliCredentialManager", () => {
 	beforeEach(() => {
 		new MockConfigurationProvider();
 		vi.clearAllMocks();
 		vol.reset();
-		vi.mocked(isKeyringEnabled).mockReturnValue(false);
-		vi.mocked(cliExec.version).mockResolvedValue("2.31.0");
+		vi.stubEnv("CODER_CONFIG_DIR", undefined);
+		// Linux: keyring unsupported, so the extension directory is used.
+		vi.mocked(os.platform).mockReturnValue("linux");
+		vi.mocked(cliExec.version).mockResolvedValue("2.32.0");
 	});
 
-	describe("storeToken", () => {
-		it("writes via coder login (file mode) when keyring is disabled", async () => {
-			stubExecFile({ stdout: "" });
-			const { manager, resolver, sink } = setup();
-
-			await expect(
-				manager.storeToken(TEST_URL, "my-token", configs),
-			).resolves.toBeUndefined();
-
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			const exec = lastExecArgs();
-			expect(exec.args).toEqual([
-				"--global-config",
-				CRED_DIR,
-				"login",
-				"--use-token-as-session",
-				TEST_URL,
-			]);
-			expect(exec.env.CODER_SESSION_TOKEN).toBe("my-token");
-			expect(exec.args).not.toContain("my-token");
-			expect(sink.expectOne("auth.credential.store")).toMatchObject({
-				properties: {
-					category: "file",
-					keyring_enabled: "false",
-					result: "success",
-				},
-			});
-		});
-
-		it("resolves binary and invokes coder login when keyring enabled", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
-			const { manager, resolver, sink } = setup();
-
-			await expect(
-				manager.storeToken(TEST_URL, "my-secret-token", configs),
-			).resolves.toBeUndefined();
-
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			const exec = lastExecArgs();
-			expect(exec.bin).toBe(TEST_BIN);
-			expect(exec.args).toEqual(["login", "--use-token-as-session", TEST_URL]);
-			// Token must only appear in env, never in args
-			expect(exec.env.CODER_SESSION_TOKEN).toBe("my-secret-token");
-			expect(exec.args).not.toContain("my-secret-token");
-			expect(sink.expectOne("auth.credential.store")).toMatchObject({
-				properties: {
-					category: "keyring",
-					keyring_enabled: "true",
-					result: "success",
-				},
-			});
-		});
-
-		it("writes via coder login under a user --global-config override", async () => {
-			stubExecFile({ stdout: "" });
-			const { manager } = setup();
-
-			await manager.storeToken(
-				TEST_URL,
-				"my-token",
-				configWithGlobalConfig(CUSTOM_CRED_DIR),
-			);
-
-			expect(lastExecArgs().args).toEqual([
-				`--global-config=${CUSTOM_CRED_DIR}`,
-				"login",
-				"--use-token-as-session",
-				TEST_URL,
-			]);
-		});
-
-		it("throws and writes no files when the binary cannot be resolved", async () => {
-			const { manager } = setup(failingResolver());
-
-			await expect(
-				manager.storeToken(TEST_URL, "my-token", configs),
-			).rejects.toThrow("no binary");
-			expect(execFile).not.toHaveBeenCalled();
-			expect(credentialFilesExist()).toBe(false);
-		});
+	afterEach(() => {
+		vi.unstubAllEnvs();
+	});
 
-		it("writes via coder login (file) when keyring is enabled but unsupported", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			vi.mocked(cliExec.version).mockResolvedValueOnce("2.28.0");
-			stubExecFile({ stdout: "" });
-			const { manager } = setup();
+	// Store selection is covered by cliConfig.test.ts; this checks the wiring.
+	interface StoreCase {
+		scenario: string;
+		platform: NodeJS.Platform;
+		configs: typeof configs;
+		expected: string[];
+		store: string;
+	}
+
+	it.each<StoreCase>([
+		{
+			scenario: "extension directory when keyring is unsupported",
+			platform: "linux",
+			configs,
+			expected: EXTENSION_FLAGS,
+			store: "extension",
+		},
+		{
+			scenario: "CLI default store when keyring is enabled",
+			platform: "darwin",
+			configs,
+			expected: KEYRING_FLAGS,
+			store: "cli",
+		},
+		{
+			scenario: "user --global-config directory",
+			platform: "linux",
+			configs: userDirConfigs,
+			expected: USER_DIR_FLAGS,
+			store: "cli",
+		},
+	])(
+		"targets the $scenario",
+		async ({ platform, configs, expected, store }) => {
+			vi.mocked(os.platform).mockReturnValue(platform);
+			stubExecFile();
+			const { manager, sink } = setup();
 
 			await manager.storeToken(TEST_URL, "token", configs);
 
-			expect(lastExecArgs().args).toEqual([
-				"--global-config",
-				CRED_DIR,
-				"login",
-				"--use-token-as-session",
-				TEST_URL,
+			expect(execCalls()).toEqual([
+				[...expected, "login", "--use-token-as-session", TEST_URL],
 			]);
-		});
-
-		it("throws when CLI exec fails", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ error: "login failed" });
-			const { manager, sink } = setup();
-
-			await expect(
-				manager.storeToken(TEST_URL, "token", configs),
-			).rejects.toThrow("Credential CLI operation failed");
 			expect(sink.expectOne("auth.credential.store")).toMatchObject({
-				properties: {
-					"error.type": "cli",
-					result: "error",
-				},
+				properties: { store, result: "success" },
 			});
-		});
-
-		it("throws when binary resolver fails and keyring enabled", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			const { manager } = setup(failingResolver());
-
-			await expect(
-				manager.storeToken(TEST_URL, "token", configs),
-			).rejects.toThrow("no binary");
-			expect(execFile).not.toHaveBeenCalled();
-		});
-
-		it("forwards header command args", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
-			const { manager } = setup();
-
-			await manager.storeToken(TEST_URL, "token", configWithHeaders);
+		},
+	);
 
-			expect(lastExecArgs().args).toContain("--header-command");
-		});
-
-		it("passes timeout to execFile", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
-			const { manager } = setup();
-
-			await manager.storeToken(TEST_URL, "token", configs);
-
-			expect(lastExecArgs().timeout).toBe(60_000);
-		});
-
-		it("passes signal through to execFile", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
+	describe("storeToken", () => {
+		it("passes the token through the environment only", async () => {
+			stubExecFile();
 			const { manager } = setup();
-			const ac = new AbortController();
 
-			await manager.storeToken(TEST_URL, "token", configs, {
-				signal: ac.signal,
-			});
+			await manager.storeToken(TEST_URL, "my-secret-token", configs);
 
-			expect(lastExecArgs().signal).toBe(ac.signal);
+			expect(execOptions().env?.CODER_SESSION_TOKEN).toBe("my-secret-token");
+			expect(execCalls()[0]).not.toContain("my-secret-token");
 		});
 
-		it("rejects with AbortError when signal is pre-aborted", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFileAbortable();
-			const { manager, sink } = setup();
+		interface CliErrorCase {
+			scenario: string;
+			error: Error;
+			message: string;
+		}
 
-			await expect(
-				manager.storeToken(TEST_URL, "token", configs, {
-					signal: AbortSignal.abort(),
+		it.each<CliErrorCase>([
+			{
+				scenario: "the CLI's stderr",
+				error: Object.assign(new Error("Command failed"), {
+					stderr: "keychain is locked\n",
 				}),
-			).rejects.toThrow("The operation was aborted");
-			const event = sink.expectOne("auth.credential.store");
-			expect(event).toMatchObject({
-				properties: { result: "aborted" },
-			});
-			expect(event.properties["error.type"]).toBeUndefined();
-		});
+				message: "keychain is locked",
+			},
+			{
+				scenario: "the error message without stderr",
+				error: new Error("login failed"),
+				message: "login failed",
+			},
+		])(
+			"throws a CredentialCliError carrying $scenario",
+			async ({ error, message }) => {
+				stubExecFile({ login: error });
+				const { manager, sink } = setup();
+
+				await expect(
+					manager.storeToken(TEST_URL, "token", configs),
+				).rejects.toThrow(message);
+				expect(sink.expectOne("auth.credential.store")).toMatchObject({
+					properties: { "error.type": "cli", result: "error" },
+				});
+			},
+		);
 	});
 
 	describe("readToken", () => {
-		it("returns trimmed token from CLI stdout", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "  my-token\n" });
-			const { manager, resolver } = setup();
-
-			const token = await manager.readToken(TEST_URL, configs);
-
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			expect(token).toEqual({ token: "my-token", source: "keyring" });
-			expect(lastExecArgs().args).toEqual([
-				"login",
-				"token",
-				"--url",
-				TEST_URL,
-			]);
-		});
-
-		it("returns undefined on whitespace-only stdout", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "  \n" });
+		it("returns the trimmed token from the CLI store", async () => {
+			vi.mocked(os.platform).mockReturnValue("darwin");
+			stubExecFile({ token: "  my-token\n" });
 			const { manager } = setup();
-			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
-		});
 
-		it("returns undefined on CLI error", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ error: "no token found" });
-			const { manager } = setup();
-			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
+			expect(await manager.readToken(TEST_URL, configs)).toBe("my-token");
+			expect(execCalls()).toEqual([[...KEYRING_FLAGS, "login", "token"]]);
 		});
 
-		it("returns undefined when binary resolver fails", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			const { manager } = setup(failingResolver());
-
-			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
-			expect(execFile).not.toHaveBeenCalled();
-		});
-
-		it("reads via coder login token (file mode) when keyring is disabled", async () => {
-			stubExecFile({ stdout: "file-token\n" });
-			const { manager, resolver } = setup();
-
-			expect(await manager.readToken(TEST_URL, configs)).toEqual({
-				token: "file-token",
-				source: "files",
-			});
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			expect(lastExecArgs().args).toEqual([
-				"--global-config",
-				CRED_DIR,
-				"login",
-				"token",
-				"--url",
-				TEST_URL,
-			]);
-		});
+		interface ReadTokenCase {
+			scenario: string;
+			token: ExecResult;
+		}
 
-		it("reads via coder login token under a user --global-config override", async () => {
-			stubExecFile({ stdout: "custom-file-token" });
+		it.each<ReadTokenCase>([
+			{ scenario: "whitespace-only stdout", token: "  \n" },
+			{ scenario: "a CLI error", token: new Error("no token found") },
+		])("returns undefined on $scenario", async ({ token }) => {
+			stubExecFile({ token });
 			const { manager } = setup();
 
-			expect(
-				await manager.readToken(
-					TEST_URL,
-					configWithGlobalConfig(CUSTOM_CRED_DIR),
-				),
-			).toEqual({ token: "custom-file-token", source: "files" });
-			expect(lastExecArgs().args).toEqual([
-				`--global-config=${CUSTOM_CRED_DIR}`,
-				"login",
-				"token",
-				"--url",
-				TEST_URL,
-			]);
-		});
-
-		it("returns undefined for file mode on deployments older than 2.31", async () => {
-			vi.mocked(cliExec.version).mockResolvedValue("2.30.0");
-			const { manager, resolver } = setup();
-
 			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			expect(execFile).not.toHaveBeenCalled();
 		});
 
-		it("does not read when keyring token read is unsupported", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			vi.mocked(cliExec.version).mockResolvedValueOnce("2.30.0");
-			const { manager, resolver } = setup();
-
-			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			expect(execFile).not.toHaveBeenCalled();
-		});
-
-		it("returns undefined when keyring is enabled but unsupported by the CLI", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			vi.mocked(cliExec.version).mockResolvedValueOnce("2.28.0");
-			const { manager, resolver } = setup();
-
-			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			expect(execFile).not.toHaveBeenCalled();
-		});
-
-		it("returns undefined when CLI version too old for token read", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			// 2.30 supports keyringAuth but not tokenRead (requires 2.31+)
-			vi.mocked(cliExec.version).mockResolvedValueOnce("2.30.0");
-			stubExecFile({ stdout: "my-token" });
+		it("returns undefined below CLI 2.32 without running the CLI", async () => {
+			vi.mocked(cliExec.version).mockResolvedValue("2.31.0");
 			const { manager } = setup();
 
 			expect(await manager.readToken(TEST_URL, configs)).toBeUndefined();
 			expect(execFile).not.toHaveBeenCalled();
 		});
-
-		it("passes timeout to execFile", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "token" });
-			const { manager } = setup();
-
-			await manager.readToken(TEST_URL, configs);
-
-			expect(lastExecArgs().timeout).toBe(60_000);
-		});
-
-		it("passes signal through to execFile", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "token" });
-			const { manager } = setup();
-			const ac = new AbortController();
-
-			await manager.readToken(TEST_URL, configs, { signal: ac.signal });
-
-			expect(lastExecArgs().signal).toBe(ac.signal);
-		});
-
-		it("throws AbortError when signal is aborted", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFileAbortable();
-			const { manager } = setup();
-
-			await expect(
-				manager.readToken(TEST_URL, configs, {
-					signal: AbortSignal.abort(),
-				}),
-			).rejects.toThrow("The operation was aborted");
-		});
 	});
 
-	describe("deleteToken", () => {
-		it("deletes files and invokes coder logout when keyring enabled", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
-			writeCredentialFiles(TEST_URL, "old-token");
-			const { manager, resolver, sink } = setup();
-
-			const result = await manager.deleteToken(TEST_URL, configs);
-
-			expect(result).toBe(true);
-			expect(resolver).toHaveBeenCalledWith(TEST_URL);
-			const exec = lastExecArgs();
-			expect(exec.bin).toBe(TEST_BIN);
-			expect(exec.args).toEqual(["logout", "--url", TEST_URL, "--yes"]);
-			expect(credentialFilesExist()).toBe(false);
-			expect(sink.expectOne("auth.credential.clear")).toMatchObject({
-				properties: {
-					category: "keyring",
-					keyring_enabled: "true",
-					result: "success",
-				},
-			});
-		});
+	describe("holdsToken", () => {
+		interface HoldsTokenCase {
+			scenario: string;
+			platform: NodeJS.Platform;
+			version?: string;
+			cliToken?: string;
+			expected: boolean;
+		}
 
-		it("deletes files and invokes coder logout (file) when keyring is disabled", async () => {
-			stubExecFile({ stdout: "" });
-			writeCredentialFiles(TEST_URL, "old-token");
-			const { manager } = setup();
+		it.each<HoldsTokenCase>([
+			{ scenario: "the extension store", platform: "linux", expected: false },
+			{
+				scenario: "the CLI store holding the token",
+				platform: "darwin",
+				expected: true,
+			},
+			{
+				scenario: "the CLI store holding another token",
+				platform: "darwin",
+				cliToken: "other",
+				expected: false,
+			},
+			{
+				scenario: "the CLI store below 2.32, which cannot be read",
+				platform: "darwin",
+				version: "2.31.0",
+				cliToken: "other",
+				expected: true,
+			},
+		])(
+			"is $expected for $scenario",
+			async ({
+				platform,
+				version = "2.32.0",
+				cliToken = "my-token",
+				expected,
+			}) => {
+				vi.mocked(os.platform).mockReturnValue(platform);
+				vi.mocked(cliExec.version).mockResolvedValue(version);
+				stubExecFile({ token: cliToken });
+
+				expect(
+					await setup().manager.holdsToken(TEST_URL, "my-token", configs),
+				).toBe(expected);
+			},
+		);
+	});
 
-			await manager.deleteToken(TEST_URL, configs);
+	interface HasCliStoreCase {
+		scenario: string;
+		platform: NodeJS.Platform;
+		binary: string | undefined;
+		expected: boolean;
+	}
+
+	it.each<HasCliStoreCase>([
+		{
+			scenario: "the extension store",
+			platform: "linux",
+			binary: TEST_BIN,
+			expected: false,
+		},
+		{
+			scenario: "the CLI store",
+			platform: "darwin",
+			binary: TEST_BIN,
+			expected: true,
+		},
+		{
+			scenario: "the CLI store without a binary",
+			platform: "darwin",
+			binary: undefined,
+			expected: false,
+		},
+	])(
+		"hasCliStore is $expected for $scenario",
+		async ({ platform, binary, expected }) => {
+			vi.mocked(os.platform).mockReturnValue(platform);
+			const { manager } = setup(vi.fn().mockResolvedValue(binary));
+
+			expect(await manager.hasCliStore(TEST_URL, configs)).toBe(expected);
+		},
+	);
 
-			expect(lastExecArgs().args).toEqual([
-				"--global-config",
-				CRED_DIR,
-				"logout",
-				"--url",
-				TEST_URL,
-				"--yes",
-			]);
-			expect(credentialFilesExist()).toBe(false);
-		});
+	describe("deleteToken", () => {
+		interface DeleteTokenCase {
+			scenario: string;
+			platform: NodeJS.Platform;
+			signOutCli: boolean;
+			logout: string[] | undefined;
+			outcome: string;
+		}
 
-		it("never throws on CLI error", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ error: "logout failed" });
+		it.each<DeleteTokenCase>([
+			{
+				scenario: "always logs out of the extension store",
+				platform: "linux",
+				signOutCli: false,
+				logout: EXTENSION_FLAGS,
+				outcome: "logged_out",
+			},
+			{
+				scenario: "logs out of the CLI store when asked",
+				platform: "darwin",
+				signOutCli: true,
+				logout: KEYRING_FLAGS,
+				outcome: "logged_out",
+			},
+			{
+				scenario: "keeps the CLI session unless asked",
+				platform: "darwin",
+				signOutCli: false,
+				logout: undefined,
+				outcome: "kept",
+			},
+		])("$scenario", async ({ platform, signOutCli, logout, outcome }) => {
+			vi.mocked(os.platform).mockReturnValue(platform);
+			stubExecFile();
+			writeCredentialFiles();
 			const { manager, sink } = setup();
 
-			await expect(manager.deleteToken(TEST_URL, configs)).resolves.toBe(false);
-			expect(sink.expectOne("auth.credential.clear")).toMatchObject({
-				properties: {
-					"error.type": "cli",
-					result: "error",
-				},
-			});
-		});
-
-		it("never throws when binary resolver fails", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			const { manager, sink } = setup(failingResolver());
-
-			await expect(manager.deleteToken(TEST_URL, configs)).resolves.toBe(false);
-			expect(execFile).not.toHaveBeenCalled();
-			expect(sink.expectOne("auth.credential.clear")).toMatchObject({
-				properties: {
-					category: "keyring",
-					"error.type": "binary",
-					result: "error",
-				},
+			const result = await manager.deleteToken(TEST_URL, configs, {
+				signOutCli,
 			});
-		});
-
-		it("forwards header command args", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
-			const { manager } = setup();
-
-			await manager.deleteToken(TEST_URL, configWithHeaders);
-
-			expect(lastExecArgs().args).toContain("--header-command");
-		});
-
-		it("logs out via coder logout (file) when keyring is enabled but unsupported", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			vi.mocked(cliExec.version).mockResolvedValueOnce("2.28.0");
-			stubExecFile({ stdout: "" });
-			writeCredentialFiles(TEST_URL, "old-token");
-			const { manager } = setup();
 
-			await manager.deleteToken(TEST_URL, configs);
-
-			expect(lastExecArgs().args).toEqual([
-				"--global-config",
-				CRED_DIR,
-				"logout",
-				"--url",
-				TEST_URL,
-				"--yes",
-			]);
+			expect(result).toBe(true);
+			expect(execCalls()).toEqual(
+				logout ? [[...logout, "logout", "--yes"]] : [],
+			);
 			expect(credentialFilesExist()).toBe(false);
+			expect(sink.expectOne("auth.credential.clear").properties).toMatchObject({
+				result: "success",
+				outcome,
+			});
 		});
 
-		it("passes signal through to execFile", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFile({ stdout: "" });
-			const { manager } = setup();
-			const ac = new AbortController();
-
-			await manager.deleteToken(TEST_URL, configs, { signal: ac.signal });
-
-			expect(lastExecArgs().signal).toBe(ac.signal);
-		});
-
-		it("throws AbortError when signal is aborted", async () => {
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
-			stubExecFileAbortable();
+		it("reports a failed logout without throwing", async () => {
+			stubExecFile({ logout: new Error("logout failed") });
 			const { manager, sink } = setup();
 
 			await expect(
-				manager.deleteToken(TEST_URL, configs, {
-					signal: AbortSignal.abort(),
-				}),
-			).rejects.toThrow("The operation was aborted");
-			const event = sink.expectOne("auth.credential.clear");
-			expect(event).toMatchObject({
-				properties: { result: "aborted" },
+				manager.deleteToken(TEST_URL, configs, { signOutCli: true }),
+			).resolves.toBe(false);
+			expect(sink.expectOne("auth.credential.clear")).toMatchObject({
+				properties: { "error.type": "cli", result: "error" },
 			});
-			expect(event.properties["error.type"]).toBeUndefined();
 		});
 	});
+
+	describe("every CLI call", () => {
+		type Run = (
+			manager: CliCredentialManager,
+			options: { signal: AbortSignal },
+		) => Promise<unknown>;
+		interface Operation {
+			name: string;
+			run: Run;
+			event?: string;
+			whenMissing: (result: Promise<unknown>) => Promise<unknown>;
+			whenBroken: (result: Promise<unknown>) => Promise<unknown>;
+		}
+		const operations: Operation[] = [
+			{
+				name: "storeToken",
+				run: (m, o) => m.storeToken(TEST_URL, "token", configs, o),
+				event: "auth.credential.store",
+				whenMissing: (r) => expect(r).resolves.toBeUndefined(),
+				whenBroken: (r) => expect(r).rejects.toThrow("broken"),
+			},
+			{
+				name: "readToken",
+				run: (m, o) => m.readToken(TEST_URL, configs, o),
+				whenMissing: (r) => expect(r).resolves.toBeUndefined(),
+				whenBroken: (r) => expect(r).resolves.toBeUndefined(),
+			},
+			{
+				name: "deleteToken",
+				run: (m, o) =>
+					m.deleteToken(TEST_URL, configs, { ...o, signOutCli: true }),
+				event: "auth.credential.clear",
+				whenMissing: (r) => expect(r).resolves.toBe(true),
+				whenBroken: (r) => expect(r).resolves.toBe(false),
+			},
+		];
+
+		it.each(operations)(
+			"$name passes the timeout and signal",
+			async ({ run }) => {
+				stubExecFile({ token: "token" });
+				const { manager } = setup();
+				const ac = new AbortController();
+
+				await run(manager, { signal: ac.signal });
+
+				expect(execOptions()).toMatchObject({
+					timeout: 60_000,
+					signal: ac.signal,
+				});
+			},
+		);
+
+		it.each(operations)(
+			"$name rethrows AbortError and records the abort",
+			async ({ run, event }) => {
+				stubExecFile("abort");
+				const { manager, sink } = setup();
+
+				await expect(
+					run(manager, { signal: AbortSignal.abort() }),
+				).rejects.toThrow("The operation was aborted");
+				if (event) {
+					const span = sink.expectOne(event);
+					expect(span.properties).toMatchObject({ result: "aborted" });
+					expect(span.properties["error.type"]).toBeUndefined();
+				}
+			},
+		);
+
+		it.each(operations)(
+			"$name is skipped when no binary is downloaded",
+			async ({ run, event, whenMissing }) => {
+				const { manager, sink } = setup(vi.fn().mockResolvedValue(undefined));
+
+				await whenMissing(
+					run(manager, { signal: new AbortController().signal }),
+				);
+
+				expect(execFile).not.toHaveBeenCalled();
+				if (event) {
+					expect(sink.expectOne(event).properties).toMatchObject({
+						result: "success",
+						outcome: "no_binary",
+					});
+				}
+			},
+		);
+
+		it.each(operations)(
+			"$name reports a binary that cannot be resolved without running the CLI",
+			async ({ run, event, whenBroken }) => {
+				const { manager, sink } = setup(
+					vi.fn().mockRejectedValue(new Error("broken")),
+				);
+
+				await whenBroken(
+					run(manager, { signal: new AbortController().signal }),
+				);
+
+				expect(execFile).not.toHaveBeenCalled();
+				if (event) {
+					expect(sink.expectOne(event).properties).toMatchObject({
+						result: "error",
+						"error.type": "binary",
+					});
+				}
+			},
+		);
+	});
 });
diff --git a/test/unit/core/cliExec.test.ts b/test/unit/core/cliExec.test.ts
index 7fb81a5014..43e99cb16f 100644
--- a/test/unit/core/cliExec.test.ts
+++ b/test/unit/core/cliExec.test.ts
@@ -35,6 +35,20 @@ vi.mock("node:child_process", async (importOriginal) => {
 const cliExec = await import("@/core/cliExec");
 const { spawn } = await import("node:child_process");
 
+const sharedAuth = (url: string): CliEnv["auth"] => ({
+	store: "cli",
+	url,
+	useKeyring: undefined,
+	allowRedirects: false,
+});
+const privateAuth = (url: string, configDir: string): CliEnv["auth"] => ({
+	store: "extension",
+	url,
+	configDir,
+	useKeyring: undefined,
+	allowRedirects: false,
+});
+
 describe("cliExec", () => {
 	const tmp = path.join(os.tmpdir(), "vscode-coder-tests-cliExec");
 	let echoArgsBin: string;
@@ -97,6 +111,27 @@ describe("cliExec", () => {
 			);
 		});
 
+		it("reuses the version until the binary changes", async () => {
+			const at = new Date("2026-01-01T00:00:00Z");
+			const versionBin = (v: string) => echoBin(JSON.stringify({ version: v }));
+			const bin = await writeExecutable(
+				tmp,
+				"ver-cached",
+				versionBin("v1.0.0"),
+			);
+			await fs.utimes(bin, at, at);
+			expect(await cliExec.version(bin)).toBe("v1.0.0");
+
+			// Same size and mtime: served from the cache without running the file.
+			await writeExecutable(tmp, "ver-cached", versionBin("v2.0.0"));
+			await fs.utimes(bin, at, at);
+			expect(await cliExec.version(bin)).toBe("v1.0.0");
+
+			// A new mtime invalidates it.
+			await writeExecutable(tmp, "ver-cached", versionBin("v3.0.0"));
+			expect(await cliExec.version(bin)).toBe("v3.0.0");
+		});
+
 		it("parses version from JSON output", async () => {
 			const bin = await writeExecutable(
 				tmp,
@@ -154,10 +189,7 @@ describe("cliExec", () => {
 
 	describe("speedtest", () => {
 		it("passes global, header, and command-specific flags", async () => {
-			const { configs, env } = setup({
-				mode: "url",
-				url: "http://localhost:3000",
-			});
+			const { configs, env } = setup(sharedAuth("http://localhost:3000"));
 			configs.set("coder.headerCommand", "my-header-cmd");
 			const args = (await cliExec.speedtest(env, "owner/workspace", "10s"))
 				.trim()
@@ -182,10 +214,7 @@ describe("cliExec", () => {
 				`process.exit(1);`,
 			].join("\n");
 			const bin = await writeExecutable(tmp, "speedtest-err", code);
-			const { env } = setup(
-				{ mode: "global-config", configDir: "/tmp", allowOverride: true },
-				bin,
-			);
+			const { env } = setup(privateAuth("http://localhost:3000", "/tmp"), bin);
 			await expect(
 				cliExec.speedtest(env, "owner/workspace", "bad"),
 			).rejects.toThrow("invalid argument for -t flag");
@@ -195,10 +224,7 @@ describe("cliExec", () => {
 			// Hangs forever so the only way out is the abort signal.
 			const code = `setInterval(() => {}, 1000);`;
 			const bin = await writeExecutable(tmp, "speedtest-hang", code);
-			const { env } = setup(
-				{ mode: "global-config", configDir: "/tmp", allowOverride: true },
-				bin,
-			);
+			const { env } = setup(privateAuth("http://localhost:3000", "/tmp"), bin);
 			const ac = new AbortController();
 			ac.abort();
 			await expect(
@@ -209,10 +235,7 @@ describe("cliExec", () => {
 
 	describe("netcheck", () => {
 		it("passes global and header flags", async () => {
-			const { configs, env } = setup({
-				mode: "url",
-				url: "http://localhost:3000",
-			});
+			const { configs, env } = setup(sharedAuth("http://localhost:3000"));
 			configs.set("coder.headerCommand", "my-header-cmd");
 			const args = (await cliExec.netcheck(env)).trim().split("\n");
 			expect(args).toEqual([
@@ -230,10 +253,7 @@ describe("cliExec", () => {
 				`process.exit(1);`,
 			].join("\n");
 			const bin = await writeExecutable(tmp, "netcheck-err", code);
-			const { env } = setup(
-				{ mode: "global-config", configDir: "/tmp", allowOverride: true },
-				bin,
-			);
+			const { env } = setup(privateAuth("http://localhost:3000", "/tmp"), bin);
 			await expect(cliExec.netcheck(env)).rejects.toThrow(
 				"You are not logged in",
 			);
@@ -243,10 +263,7 @@ describe("cliExec", () => {
 			// Hangs forever so the only way out is the abort signal.
 			const code = `setInterval(() => {}, 1000);`;
 			const bin = await writeExecutable(tmp, "netcheck-hang", code);
-			const { env } = setup(
-				{ mode: "global-config", configDir: "/tmp", allowOverride: true },
-				bin,
-			);
+			const { env } = setup(privateAuth("http://localhost:3000", "/tmp"), bin);
 			const ac = new AbortController();
 			ac.abort();
 			await expect(cliExec.netcheck(env, ac.signal)).rejects.toMatchObject({
@@ -266,10 +283,7 @@ describe("cliExec", () => {
 			].join("\n");
 			const bin = await writeExecutable(tmp, "sb-echo-args", code);
 			const outputPath = path.join(tmp, "sb-args-output.zip");
-			const { configs, env } = setup(
-				{ mode: "url", url: "http://localhost:3000" },
-				bin,
-			);
+			const { configs, env } = setup(sharedAuth("http://localhost:3000"), bin);
 			configs.set("coder.headerCommand", "my-header-cmd");
 			await cliExec.supportBundle(env, "owner/workspace", {
 				outputPath,
@@ -307,7 +321,7 @@ describe("cliExec", () => {
 			].join("\n");
 			const bin = await writeExecutable(tmp, "sb-echo-defaults", code);
 			const outputPath = path.join(tmp, "sb-defaults-output.zip");
-			const { env } = setup({ mode: "url", url: "http://localhost:3000" }, bin);
+			const { env } = setup(sharedAuth("http://localhost:3000"), bin);
 			await cliExec.supportBundle(env, "owner/workspace", { outputPath });
 			const args = (await fs.readFile(outputPath, "utf-8")).trim().split("\n");
 			expect(args).toEqual([
@@ -328,10 +342,7 @@ describe("cliExec", () => {
 				`process.exit(1);`,
 			].join("\n");
 			const bin = await writeExecutable(tmp, "sb-err", code);
-			const { env } = setup(
-				{ mode: "global-config", configDir: "/tmp", allowOverride: true },
-				bin,
-			);
+			const { env } = setup(privateAuth("http://localhost:3000", "/tmp"), bin);
 			await expect(
 				cliExec.supportBundle(env, "owner/workspace", {
 					outputPath: "/tmp/bundle.zip",
@@ -376,7 +387,7 @@ describe("cliExec", () => {
 		});
 
 		it("spawns coder ping with raw argv (no shell, unescaped workspace name)", () => {
-			const { env } = setup({ mode: "url", url: "https://test.coder.com" });
+			const { env } = setup(sharedAuth("https://test.coder.com"));
 			cliExec.ping(env, "owner/my workspace");
 
 			expect(spawn).toHaveBeenCalledWith(
@@ -387,24 +398,30 @@ describe("cliExec", () => {
 		});
 
 		it("includes user global flags raw in the spawn argv", () => {
-			const { configs, env } = setup({
-				mode: "global-config",
-				configDir: "/cfg",
-				allowOverride: true,
-			});
+			const { configs, env } = setup(
+				privateAuth("https://test.coder.com", "/cfg"),
+			);
 			configs.set("coder.globalFlags", ["--verbose"]);
 
 			cliExec.ping(env, "owner/ws");
 
 			expect(spawn).toHaveBeenCalledWith(
 				env.binary,
-				["--verbose", "--global-config", "/cfg", "ping", "owner/ws"],
+				[
+					"--verbose",
+					"--global-config",
+					"/cfg",
+					"--url",
+					"https://test.coder.com",
+					"ping",
+					"owner/ws",
+				],
 				expect.objectContaining({ detached: process.platform !== "win32" }),
 			);
 		});
 
 		it("reports ENOENT once even when `close` fires after `error`", () => {
-			const { env } = setup({ mode: "url", url: "https://test.coder.com" });
+			const { env } = setup(sharedAuth("https://test.coder.com"));
 			cliExec.ping(env, "owner/ws");
 
 			// Real Node emits `error` then `close(null, null)` on missing binary.
diff --git a/test/unit/core/cliManager.test.ts b/test/unit/core/cliManager.test.ts
index c150c1649c..e38d257a15 100644
--- a/test/unit/core/cliManager.test.ts
+++ b/test/unit/core/cliManager.test.ts
@@ -4,7 +4,6 @@ import { afterEach, describe, expect, it, vi } from "vitest";
 import * as vscode from "vscode";
 
 import * as pgp from "@/pgp";
-import { isKeyringEnabled } from "@/settings/cli";
 
 import { expectPathsEqual } from "../../utils/platform";
 
@@ -27,12 +26,6 @@ import type * as fs from "node:fs";
 
 vi.mock("os");
 vi.mock("axios");
-vi.mock("@/settings/cli", async () => {
-	const actual =
-		await vi.importActual<typeof import("@/settings/cli")>("@/settings/cli");
-	return { ...actual, isKeyringEnabled: vi.fn().mockReturnValue(false) };
-});
-
 vi.mock("fs", async () => {
 	const memfs: { fs: typeof fs } = await vi.importActual("memfs");
 	return { ...memfs.fs, default: memfs.fs };
@@ -141,11 +134,9 @@ describe("CliManager", () => {
 			expectPathsEqual(await manager.locateBinary(TEST_URL), BINARY_PATH);
 		});
 
-		it("throws when binary does not exist", async () => {
+		it("returns undefined when binary does not exist", async () => {
 			const { manager } = setupCliManager();
-			await expect(manager.locateBinary(TEST_URL)).rejects.toThrow(
-				"No CLI binary found at",
-			);
+			await expect(manager.locateBinary(TEST_URL)).resolves.toBeUndefined();
 		});
 	});
 
@@ -183,12 +174,10 @@ describe("CliManager", () => {
 				expectPathsEqual(await t.manager.locateBinary(TEST_URL), FILE_PATH);
 			});
 
-			it("locateBinary throws when file does not exist", async () => {
+			it("locateBinary returns undefined when file does not exist", async () => {
 				const { manager, mockConfig } = setupCliManager();
 				mockConfig.set("coder.binaryDestination", "/nonexistent/coder");
-				await expect(manager.locateBinary(TEST_URL)).rejects.toThrow(
-					"No CLI binary found at",
-				);
+				await expect(manager.locateBinary(TEST_URL)).resolves.toBeUndefined();
 			});
 
 			it("fetchBinary uses file when version matches", async () => {
@@ -310,57 +299,93 @@ describe("CliManager", () => {
 	describe("Clear Credentials", () => {
 		const CLEAR_URL = "https://dev.coder.com";
 
-		it("should skip progress notification when keyring is disabled", async () => {
-			const { manager, mockCredManager } = setupCliManager();
-
-			await manager.clearCredentials(CLEAR_URL);
-
-			expect(vscode.window.withProgress).not.toHaveBeenCalled();
-			expect(mockCredManager.deleteToken).toHaveBeenCalledWith(
-				CLEAR_URL,
-				expect.anything(),
-				{ signal: expect.any(AbortSignal) },
-			);
-		});
+		interface ProgressCase {
+			signOutCli: boolean;
+			progress: number;
+		}
 
-		it("should show progress notification when keyring is enabled", async () => {
-			const { manager } = setupCliManager();
-			vi.mocked(isKeyringEnabled).mockReturnValue(true);
+		it.each<ProgressCase>([
+			{ signOutCli: false, progress: 0 },
+			{ signOutCli: true, progress: 1 },
+		])(
+			"shows progress $progress time(s) when signOutCli is $signOutCli",
+			async ({ signOutCli, progress }) => {
+				const { manager, mockCredManager } = setupCliManager();
 
-			await manager.clearCredentials(CLEAR_URL);
+				await manager.clearCredentials(CLEAR_URL, { signOutCli });
 
-			expect(vscode.window.withProgress).toHaveBeenCalledWith(
-				expect.objectContaining({
-					location: vscode.ProgressLocation.Notification,
-					title: `Removing credentials for ${CLEAR_URL}`,
-					cancellable: true,
-				}),
-				expect.any(Function),
-			);
-		});
+				expect(vscode.window.withProgress).toHaveBeenCalledTimes(progress);
+				expect(mockCredManager.deleteToken).toHaveBeenCalledWith(
+					CLEAR_URL,
+					expect.anything(),
+					{ signal: expect.any(AbortSignal), signOutCli },
+				);
+			},
+		);
 
 		it.each([
-			{ scenario: "succeeds", error: undefined, cleared: true },
+			{
+				scenario: "succeeds",
+				error: undefined,
+				expected: true,
+			},
 			{
 				scenario: "fails",
 				error: new Error("unexpected failure"),
-				cleared: false,
+				expected: false,
+			},
+			{
+				scenario: "is cancelled",
+				error: makeAbortError(),
+				expected: false,
 			},
-			{ scenario: "is cancelled", error: makeAbortError(), cleared: false },
 		])(
 			"should report cleanup state when deleteToken $scenario",
-			async ({ error, cleared }) => {
+			async ({ error, expected }) => {
 				const { manager, mockCredManager } = setupCliManager();
 				if (error) {
 					vi.mocked(mockCredManager.deleteToken).mockRejectedValueOnce(error);
+				} else {
+					vi.mocked(mockCredManager.deleteToken).mockResolvedValueOnce(
+						expected,
+					);
 				}
-				await expect(manager.clearCredentials(CLEAR_URL)).resolves.toBe(
-					cleared,
-				);
+				await expect(
+					manager.clearCredentials(CLEAR_URL, { signOutCli: true }),
+				).resolves.toEqual(expected);
 			},
 		);
 	});
 
+	describe("Holds Token", () => {
+		const URL = "https://dev.coder.com";
+
+		it("asks the CLI under cancellable progress", async () => {
+			const { manager, mockCredManager } = setupCliManager();
+			vi.mocked(mockCredManager.holdsToken).mockResolvedValueOnce(true);
+
+			expect(await manager.holdsToken(URL, "t")).toBe(true);
+			expect(vscode.window.withProgress).toHaveBeenCalledTimes(1);
+		});
+
+		it("counts a cancelled check as not held", async () => {
+			const { manager, mockCredManager } = setupCliManager();
+			vi.mocked(mockCredManager.holdsToken).mockRejectedValueOnce(
+				makeAbortError(),
+			);
+
+			expect(await manager.holdsToken(URL, "t")).toBe(false);
+		});
+
+		it("skips the CLI when it has no store to check", async () => {
+			const { manager, mockCredManager } = setupCliManager();
+			vi.mocked(mockCredManager.hasCliStore).mockResolvedValueOnce(false);
+
+			expect(await manager.holdsToken(URL, "t")).toBe(false);
+			expect(vscode.window.withProgress).not.toHaveBeenCalled();
+		});
+	});
+
 	describe("Binary Version Validation", () => {
 		it("rejects invalid server versions", async () => {
 			const { manager, mockApi } = setupCliManager();
diff --git a/test/unit/core/secretsManager.test.ts b/test/unit/core/secretsManager.test.ts
index c66d5c4bbe..482d71e0a9 100644
--- a/test/unit/core/secretsManager.test.ts
+++ b/test/unit/core/secretsManager.test.ts
@@ -502,9 +502,12 @@ describe("SecretsManager", () => {
 
 			const sessionAuthCases: BackwardsCompatTestCase[] = [
 				{
-					name: "without optional oauth field",
+					name: "without optional fields",
 					data: { url: "https://coder.example.com", token: "test-token" },
-					expected: { url: "https://coder.example.com", token: "test-token" },
+					expected: {
+						url: "https://coder.example.com",
+						token: "test-token",
+					},
 				},
 				{
 					name: "with OAuth without optional fields",
diff --git a/test/unit/featureSet.test.ts b/test/unit/featureSet.test.ts
index ccfd508065..0a97b3bf77 100644
--- a/test/unit/featureSet.test.ts
+++ b/test/unit/featureSet.test.ts
@@ -52,8 +52,8 @@ describe("check version support", () => {
 	it("token read", () => {
 		expectFlag(
 			"tokenRead",
-			["v2.30.0", "v2.29.0", "v2.28.0", "v1.0.0"],
-			["v2.31.0", "v2.31.1", "v2.32.0", "v3.0.0"],
+			["v2.31.1", "v2.31.0", "v2.30.0", "v1.0.0"],
+			["v2.32.0", "v2.32.1", "v2.33.0", "v3.0.0"],
 		);
 	});
 	it("support bundle", () => {
@@ -63,6 +63,13 @@ describe("check version support", () => {
 			["v2.10.0", "v2.10.1", "v2.11.0", "v3.0.0"],
 		);
 	});
+	it("allow redirects", () => {
+		expectFlag(
+			"allowRedirects",
+			["v2.37.1", "v2.37.0", "v2.36.5", "v1.0.0"],
+			["v2.38.0", "v2.38.1", "v2.39.0", "v3.0.0"],
+		);
+	});
 	it("support bundle workspace files", () => {
 		expectFlag(
 			"supportBundleWorkspaceFiles",
diff --git a/test/unit/login/loginCoordinator.test.ts b/test/unit/login/loginCoordinator.test.ts
index 44bfbb7982..eb1870a25b 100644
--- a/test/unit/login/loginCoordinator.test.ts
+++ b/test/unit/login/loginCoordinator.test.ts
@@ -179,14 +179,55 @@ function createTestContext(telemetry?: TelemetryService) {
 	};
 }
 
+/** Test context plus shorthands for a sign-in that `prompt` may guard. */
+function createSignInTestContext(
+	prompt: string,
+	detail: (username: string) => string,
+) {
+	const ctx = createTestContext();
+	return {
+		...ctx,
+		/** Queue one getAuthenticatedUser result per expected call, in order. */
+		authSequence: (...results: Array<User | "unauthorized">) => {
+			for (const result of results) {
+				if (result === "unauthorized") {
+					mockGetAuthenticatedUser.mockRejectedValueOnce(
+						createAxiosError(401, "Unauthorized"),
+					);
+				} else {
+					mockGetAuthenticatedUser.mockResolvedValueOnce(result);
+				}
+			}
+		},
+		storeSession: (auth: { token: string; username?: string; url?: string }) =>
+			ctx.secretsManager.setSessionAuth(TEST_HOSTNAME, {
+				url: TEST_URL,
+				...auth,
+			}),
+		confirmSignIn: () => ctx.userInteraction.setResponse(prompt, "Sign In"),
+		dismissSignIn: () => ctx.userInteraction.setResponse(prompt, undefined),
+		storedToken: async () =>
+			(await ctx.secretsManager.getSessionAuth(TEST_HOSTNAME))?.token,
+		/** Assert the prompt named the user and the session it replaces. */
+		expectSignInPrompt: (username: string, replaces?: string) =>
+			expect(vscode.window.showWarningMessage).toHaveBeenCalledWith(
+				prompt,
+				expect.objectContaining({
+					detail: `${TEST_URL}\n\n${detail(username)}${replaces ? `, replacing your ${replaces}` : ""}.`,
+				}),
+				"Sign In",
+			),
+		expectNoPrompt: () =>
+			expect(vscode.window.showWarningMessage).not.toHaveBeenCalled(),
+	};
+}
+
 describe("LoginCoordinator", () => {
 	describe("token authentication", () => {
-		it("authenticates with stored token on success", async () => {
+		it("authenticates with a stored token", async () => {
 			const { secretsManager, coordinator, mockSuccessfulAuth } =
 				createTestContext();
 			const user = mockSuccessfulAuth();
-
-			// Pre-store a token
 			await secretsManager.setSessionAuth(TEST_HOSTNAME, {
 				url: TEST_URL,
 				token: "stored-token",
@@ -203,9 +244,6 @@ describe("LoginCoordinator", () => {
 				user,
 				token: "stored-token",
 			});
-
-			const auth = await secretsManager.getSessionAuth(TEST_HOSTNAME);
-			expect(auth?.token).toBe("stored-token");
 		});
 
 		it("authenticates with CLI credential token on success", async () => {
@@ -216,10 +254,9 @@ describe("LoginCoordinator", () => {
 				mockSuccessfulAuth,
 			} = createTestContext();
 			const user = mockSuccessfulAuth();
-			vi.mocked(mockCredentialManager.readToken).mockResolvedValueOnce({
-				token: "cli-credential-token",
-				source: "files",
-			});
+			vi.mocked(mockCredentialManager.readToken).mockResolvedValueOnce(
+				"cli-credential-token",
+			);
 
 			const result = await coordinator.ensureLoggedIn({
 				url: TEST_URL,
@@ -238,28 +275,6 @@ describe("LoginCoordinator", () => {
 			expect(auth?.token).toBe("cli-credential-token");
 		});
 
-		it("reports keyring_token method when the credential comes from the keyring", async () => {
-			const { mockCredentialManager, coordinator, mockSuccessfulAuth } =
-				createTestContext();
-			const user = mockSuccessfulAuth();
-			vi.mocked(mockCredentialManager.readToken).mockResolvedValueOnce({
-				token: "keyring-token",
-				source: "keyring",
-			});
-
-			const result = await coordinator.ensureLoggedIn({
-				url: TEST_URL,
-				safeHostname: TEST_HOSTNAME,
-			});
-
-			expect(result).toEqual({
-				success: true,
-				method: "keyring_token",
-				user,
-				token: "keyring-token",
-			});
-		});
-
 		it("prompts for token when no stored auth exists", async () => {
 			const {
 				userInteraction,
@@ -447,36 +462,14 @@ describe("LoginCoordinator", () => {
 			token,
 		});
 
-		/** Test context plus shorthands for the link sign-in flow. */
 		function createLinkTestContext() {
-			const ctx = createTestContext();
+			const ctx = createSignInTestContext(
+				SIGN_IN_PROMPT,
+				(username) =>
+					`The link contains a token that signs you in as "${username}"`,
+			);
 			return {
 				...ctx,
-				/** Queue one getAuthenticatedUser result per expected call, in order. */
-				authSequence: (...results: Array<User | "unauthorized">) => {
-					for (const result of results) {
-						if (result === "unauthorized") {
-							mockGetAuthenticatedUser.mockRejectedValueOnce(
-								createAxiosError(401, "Unauthorized"),
-							);
-						} else {
-							mockGetAuthenticatedUser.mockResolvedValueOnce(result);
-						}
-					}
-				},
-				storeSession: (auth: {
-					token: string;
-					username?: string;
-					url?: string;
-				}) =>
-					ctx.secretsManager.setSessionAuth(TEST_HOSTNAME, {
-						url: TEST_URL,
-						...auth,
-					}),
-				confirmSignIn: () =>
-					ctx.userInteraction.setResponse(SIGN_IN_PROMPT, "Sign In"),
-				dismissSignIn: () =>
-					ctx.userInteraction.setResponse(SIGN_IN_PROMPT, undefined),
 				login: (options?: { token?: string; tokenSignInConfirmed?: boolean }) =>
 					ctx.coordinator.ensureLoggedIn({
 						url: TEST_URL,
@@ -484,21 +477,6 @@ describe("LoginCoordinator", () => {
 						token: LINK_TOKEN,
 						...options,
 					}),
-				storedToken: async () =>
-					(await ctx.secretsManager.getSessionAuth(TEST_HOSTNAME))?.token,
-				/** Assert the prompt named the user and the session it replaces. */
-				expectSignInPrompt: (username: string, replaces?: string) =>
-					expect(vscode.window.showWarningMessage).toHaveBeenCalledWith(
-						SIGN_IN_PROMPT,
-						expect.objectContaining({
-							detail:
-								`${TEST_URL}\n\nThe link contains a token that signs you in as "${username}"` +
-								`${replaces ? `, replacing your ${replaces}` : ""}.`,
-						}),
-						"Sign In",
-					),
-				expectNoPrompt: () =>
-					expect(vscode.window.showWarningMessage).not.toHaveBeenCalled(),
 			};
 		}
 
@@ -784,6 +762,90 @@ describe("LoginCoordinator", () => {
 				user,
 				token: "stored-token",
 			});
+			await vi.waitFor(() =>
+				expect(vscode.window.showErrorMessage).toHaveBeenCalledWith(
+					expect.stringContaining("keyring unavailable"),
+					"Open Settings",
+				),
+			);
+		});
+	});
+
+	describe("CLI session confirmation", () => {
+		const CLI_PROMPT = "Sign in with the Coder CLI's session?";
+
+		function createCliTestContext() {
+			const ctx = createSignInTestContext(
+				CLI_PROMPT,
+				(username) => `The Coder CLI's session signs you in as "${username}"`,
+			);
+			return {
+				...ctx,
+				cliToken: (token: string) =>
+					vi
+						.mocked(ctx.mockCredentialManager.readToken)
+						.mockResolvedValueOnce(token),
+				login: () =>
+					ctx.coordinator.ensureLoggedIn({
+						url: TEST_URL,
+						safeHostname: TEST_HOSTNAME,
+					}),
+			};
+		}
+
+		it("adopts the CLI session without a prompt when there is no previous session", async () => {
+			const t = createCliTestContext();
+			const user = t.mockSuccessfulAuth(
+				createMockUser({ username: "cli-user" }),
+			);
+			t.cliToken("cli-token");
+
+			expect(await t.login()).toMatchObject({
+				method: "cli_token",
+				user,
+			});
+			t.expectNoPrompt();
+		});
+
+		it("adopts the CLI session without a prompt when it belongs to the same user", async () => {
+			const t = createCliTestContext();
+			await t.storeSession({ token: "expired-token", username: "same-user" });
+			t.authSequence("unauthorized", createMockUser({ username: "same-user" }));
+			t.cliToken("cli-token");
+
+			expect(await t.login()).toMatchObject({ token: "cli-token" });
+			t.expectNoPrompt();
+		});
+
+		it("asks before adopting a CLI session for a different user, naming both", async () => {
+			const t = createCliTestContext();
+			await t.storeSession({ token: "expired-token", username: "old-user" });
+			t.authSequence("unauthorized", createMockUser({ username: "cli-user" }));
+			t.cliToken("cli-token");
+			t.confirmSignIn();
+
+			expect(await t.login()).toMatchObject({
+				token: "cli-token",
+			});
+			t.expectSignInPrompt("cli-user", 'expired session for "old-user"');
+		});
+
+		it("falls back to asking for a token when the CLI session is declined", async () => {
+			const t = createCliTestContext();
+			await t.storeSession({ token: "expired-token", username: "old-user" });
+			t.authSequence(
+				"unauthorized",
+				createMockUser({ username: "cli-user" }),
+				createMockUser({ username: "new-user" }),
+			);
+			t.cliToken("cli-token");
+			t.dismissSignIn();
+			t.userInteraction.setInputBoxValue("new-token");
+
+			expect(await t.login()).toMatchObject({
+				token: "new-token",
+			});
+			expect(await t.storedToken()).toBe("new-token");
 		});
 	});
 
diff --git a/test/unit/oauth/sessionManager.test.ts b/test/unit/oauth/sessionManager.test.ts
index be11270d44..b02927fc4a 100644
--- a/test/unit/oauth/sessionManager.test.ts
+++ b/test/unit/oauth/sessionManager.test.ts
@@ -164,7 +164,10 @@ describe("OAuthSessionManager", () => {
 			},
 			{
 				name: "returns false when session auth has no OAuth data",
-				auth: { url: TEST_URL, token: "session-token" },
+				auth: {
+					url: TEST_URL,
+					token: "session-token",
+				},
 				expected: false,
 			},
 		])("$name", async ({ auth, expected }) => {
diff --git a/test/unit/remote/migration.test.ts b/test/unit/remote/migration.test.ts
index 0eadd0c27b..f663e77b02 100644
--- a/test/unit/remote/migration.test.ts
+++ b/test/unit/remote/migration.test.ts
@@ -76,7 +76,10 @@ describe("Session auth migration", () => {
 
 	it("does not migrate or delete files when auth already exists", async () => {
 		const { migrate, secretsManager } = setup({
-			existingAuth: { url: "https://dep.example.com", token: "current" },
+			existingAuth: {
+				url: "https://dep.example.com",
+				token: "current",
+			},
 		});
 		writeLegacyFiles();
 
diff --git a/test/unit/remote/workspaceStateMachine.test.ts b/test/unit/remote/workspaceStateMachine.test.ts
index e437b67467..cc1e970ecf 100644
--- a/test/unit/remote/workspaceStateMachine.test.ts
+++ b/test/unit/remote/workspaceStateMachine.test.ts
@@ -109,7 +109,12 @@ function setup(
 		startupMode,
 		"/usr/bin/coder",
 		{} as FeatureSet,
-		{ mode: "url", url: "https://test.coder.com" },
+		{
+			store: "cli",
+			url: "https://test.coder.com",
+			useKeyring: undefined,
+			allowRedirects: false,
+		},
 		createMockServiceContainer({ telemetry, logger: createMockLogger() }),
 	);
 	return { sm, progress, userInteraction };
diff --git a/test/unit/util/credentials.test.ts b/test/unit/util/credentials.test.ts
new file mode 100644
index 0000000000..432721cbd7
--- /dev/null
+++ b/test/unit/util/credentials.test.ts
@@ -0,0 +1,65 @@
+import * as os from "node:os";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import * as vscode from "vscode";
+
+import { showStoreCredentialsError } from "@/util/credentials";
+
+import { createMockLogger } from "../../mocks/testHelpers";
+
+vi.mock("node:os");
+
+const configs = {
+	get: vi.fn((_key: string, defaultValue?: unknown) => defaultValue),
+};
+
+describe("showStoreCredentialsError", () => {
+	beforeEach(() => {
+		vi.clearAllMocks();
+	});
+
+	interface StoreErrorCase {
+		platform: NodeJS.Platform;
+		message: string;
+	}
+
+	it.each<StoreErrorCase>([
+		{
+			platform: "darwin",
+			message:
+				'Failed to store credentials: exit status 36. To store the token in a file instead, set "coder.useKeyring" to false.',
+		},
+		{
+			platform: "linux",
+			message: "Failed to store credentials: exit status 36.",
+		},
+	])("logs and shows the failure on $platform", ({ platform, message }) => {
+		vi.mocked(os.platform).mockReturnValue(platform);
+		const logger = createMockLogger();
+
+		showStoreCredentialsError(new Error("exit status 36"), configs, logger);
+
+		expect(logger.error).toHaveBeenCalledWith(
+			"Failed to store credentials:",
+			expect.any(Error),
+		);
+		expect(vscode.window.showErrorMessage).toHaveBeenCalledWith(
+			message,
+			"Open Settings",
+		);
+	});
+
+	it("opens the coder.useKeyring setting from the toast", async () => {
+		vi.mocked(os.platform).mockReturnValue("linux");
+		vi.mocked(vscode.window.showErrorMessage).mockResolvedValueOnce(
+			"Open Settings" as unknown as vscode.MessageItem,
+		);
+
+		showStoreCredentialsError(new Error("x"), configs, createMockLogger());
+		await Promise.resolve();
+
+		expect(vscode.commands.executeCommand).toHaveBeenCalledWith(
+			"workbench.action.openSettings",
+			"coder.useKeyring",
+		);
+	});
+});
diff --git a/test/unit/util/poller.test.ts b/test/unit/util/poller.test.ts
new file mode 100644
index 0000000000..6ef48ef9d7
--- /dev/null
+++ b/test/unit/util/poller.test.ts
@@ -0,0 +1,123 @@
+import { describe, expect, it, onTestFinished, vi } from "vitest";
+
+import { Poller, type NextRun, type RetryOptions } from "@/util/poller";
+
+import { createMockLogger, flushPromises } from "../../mocks/testHelpers";
+
+import type * as vscode from "vscode";
+
+const RETRY: RetryOptions = { initialDelayMs: 1_000, maxDelayMs: 4_000 };
+const POLL: NextRun = { delayMs: 1_000 };
+
+/** A poller whose task answers with `results`, oldest first; the rest hang. */
+function setup(...results: NextRun[]) {
+	vi.useFakeTimers();
+	const tokens: vscode.CancellationToken[] = [];
+	const hanging: Array<PromiseWithResolvers<NextRun>> = [];
+	const task = vi.fn((token: vscode.CancellationToken) => {
+		tokens.push(token);
+		const next = results.shift();
+		if (next !== undefined) {
+			return Promise.resolve(next);
+		}
+		const run = Promise.withResolvers<NextRun>();
+		hanging.push(run);
+		return run.promise;
+	});
+	const logger = createMockLogger();
+	const poller = new Poller(task, RETRY, logger);
+	onTestFinished(() => {
+		poller.dispose();
+		vi.useRealTimers();
+	});
+	return {
+		poller,
+		task,
+		tokens,
+		logger,
+		/** Settle the oldest run still hanging. */
+		finish: (next: NextRun) => {
+			hanging.shift()?.resolve(next);
+			return flushPromises();
+		},
+		fail: (error: Error) => {
+			hanging.shift()?.reject(error);
+			return flushPromises();
+		},
+	};
+}
+
+describe("Poller", () => {
+	interface RunsCase {
+		name: string;
+		result: NextRun;
+		runs: number;
+	}
+
+	it.each<RunsCase>([
+		{ name: "a delay", result: POLL, runs: 2 },
+		{ name: "retry", result: "retry", runs: 2 },
+		{ name: "idle", result: "idle", runs: 1 },
+	])("answering $name runs the task $runs times", async ({ result, runs }) => {
+		const h = setup(result, "idle");
+		await h.poller.run();
+		await vi.advanceTimersByTimeAsync(POLL.delayMs);
+		expect(h.task).toHaveBeenCalledTimes(runs);
+	});
+
+	it("backs off while the task keeps failing, and starts over after a success", async () => {
+		const h = setup("retry", "retry", "retry", "retry", POLL, "retry", "idle");
+		await h.poller.run();
+		// One initial delay, then doubling, then held at the cap.
+		for (const [delayMs, runs] of [
+			[1_000, 2],
+			[2_000, 3],
+			[4_000, 4],
+			[4_000, 5],
+		]) {
+			await vi.advanceTimersByTimeAsync(delayMs);
+			expect(h.task).toHaveBeenCalledTimes(runs);
+		}
+		// The poll that succeeded reset the backoff.
+		await vi.advanceTimersByTimeAsync(POLL.delayMs + 1_000);
+		expect(h.task).toHaveBeenCalledTimes(7);
+	});
+
+	it("retries a task that throws, and logs why", async () => {
+		const h = setup();
+		const running = h.poller.run();
+		await h.fail(new Error("boom"));
+		await running;
+		await vi.advanceTimersByTimeAsync(1_000);
+		expect(h.task).toHaveBeenCalledTimes(2);
+		expect(h.logger.error).toHaveBeenCalled();
+	});
+
+	it("hands each run its own token, cancelling the one it supersedes", async () => {
+		const h = setup();
+		const superseded = h.poller.run();
+		void h.poller.run();
+		expect(h.tokens.map((t) => t.isCancellationRequested)).toEqual([
+			true,
+			false,
+		]);
+
+		// What a superseded run answers schedules nothing.
+		await h.finish(POLL);
+		await superseded;
+		await vi.advanceTimersByTimeAsync(4_000);
+		expect(h.task).toHaveBeenCalledTimes(2);
+	});
+
+	it("schedules nothing once disposed, pending or in flight", async () => {
+		const h = setup(POLL);
+		await h.poller.run();
+		const running = h.poller.run();
+		h.poller.dispose();
+		expect(h.tokens[1].isCancellationRequested).toBe(true);
+		await h.finish(POLL);
+		await running;
+		await vi.advanceTimersByTimeAsync(4_000);
+		expect(h.task).toHaveBeenCalledTimes(2);
+	});
+});
diff --git a/test/unit/webviews/dispatch.test.ts b/test/unit/webviews/dispatch.test.ts
index 33eeed9286..77c196f074 100644
--- a/test/unit/webviews/dispatch.test.ts
+++ b/test/unit/webviews/dispatch.test.ts
@@ -88,11 +88,11 @@ describe("dispatchCommand", () => {
 		expect(showError).not.toHaveBeenCalled();
 	});
 
-	it("shows errors when showErrorToUser opts in", async () => {
+	it("shows errors for methods listed as user actions", async () => {
 		await dispatchCommand(
 			{ method: "do" },
 			{ do: vi.fn().mockRejectedValue(new Error("kaboom")) },
-			{ logger, showErrorToUser: () => true },
+			{ logger, userActions: new Set(["do"]) },
 		);
 		expect(showError).toHaveBeenCalledWith("kaboom");
 	});
@@ -147,7 +147,7 @@ describe("dispatchRequest", () => {
 			{ requestId: "r4", method: "delete" },
 			{ delete: vi.fn().mockRejectedValue(new Error("nope")) },
 			webview,
-			{ logger, showErrorToUser: (m) => m === "delete" },
+			{ logger, userActions: new Set(["delete"]) },
 		);
 		expect(showError).toHaveBeenCalledWith("nope");
 	});
diff --git a/test/unit/webviews/tasks/tasksPanelProvider.test.ts b/test/unit/webviews/tasks/tasksPanelProvider.test.ts
index 1e73477d18..8850e6e835 100644
--- a/test/unit/webviews/tasks/tasksPanelProvider.test.ts
+++ b/test/unit/webviews/tasks/tasksPanelProvider.test.ts
@@ -23,6 +23,7 @@ import {
 import {
 	createAxiosError,
 	createMockLogger,
+	createMockWebviewView,
 	MockConfigurationProvider,
 	MockUserInteraction,
 } from "../../../mocks/testHelpers";
@@ -129,33 +130,10 @@ function createHarness(): Harness {
 		createMockLogger(),
 	);
 
-	const posted: unknown[] = [];
-	let handler: ((msg: unknown) => void) | null = null;
-
-	const webview: vscode.WebviewView = {
-		viewType: "coder.tasksPanel",
-		webview: {
-			options: { enableScripts: false, localResourceRoots: [] },
-			html: "",
-			cspSource: "",
-			postMessage: vi.fn((msg: unknown) => {
-				posted.push(msg);
-				return Promise.resolve(true);
-			}),
-			onDidReceiveMessage: vi.fn((h) => {
-				handler = h;
-				return { dispose: vi.fn() };
-			}),
-			asWebviewUri: vi.fn((uri: vscode.Uri) => uri),
-		},
-		visible: true,
-		show: vi.fn(),
-		onDidChangeVisibility: vi.fn(() => ({ dispose: vi.fn() })),
-		onDidDispose: vi.fn(() => ({ dispose: vi.fn() })),
-	};
+	const { view, hooks } = createMockWebviewView("coder.tasksPanel");
 
 	panel.resolveWebviewView(
-		webview,
+		view,
 		{} as vscode.WebviewViewResolveContext,
 		{} as vscode.CancellationToken,
 	);
@@ -164,19 +142,19 @@ function createHarness(): Harness {
 		panel,
 		client,
 		ui,
-		messages: () => [...posted],
+		messages: () => [...hooks.postedMessages],
 		request: async <P, R>(
 			def: RequestDef<P, R>,
 			...args: P extends void ? [] : [params: P]
 		) => {
 			const params = args[0];
 			const requestId = `req-${Date.now()}-${Math.random()}`;
-			handler?.({ requestId, method: def.method, params });
+			hooks.sendFromWebview({ requestId, method: def.method, params });
 
 			await vi.waitFor(
 				() => {
 					if (
-						!posted.some(
+						!hooks.postedMessages.some(
 							(m) => (m as { requestId?: string }).requestId === requestId,
 						)
 					) {
@@ -186,7 +164,7 @@ function createHarness(): Harness {
 				{ timeout: 1000 },
 			);
 
-			return posted.find(
+			return hooks.postedMessages.find(
 				(m) => (m as { requestId?: string }).requestId === requestId,
 			) as { success: boolean; data?: R; error?: string };
 		},
@@ -194,7 +172,7 @@ function createHarness(): Harness {
 			def: CommandDef<P>,
 			...args: P extends void ? [] : [params: P]
 		) => {
-			handler?.({ method: def.method, params: args[0] });
+			hooks.sendFromWebview({ method: def.method, params: args[0] });
 			await new Promise((r) => setTimeout(r, 10));
 		},
 	};
diff --git a/test/unit/webviews/workspaces/panelProvider.test.ts b/test/unit/webviews/workspaces/panelProvider.test.ts
new file mode 100644
index 0000000000..c0bbfe271e
--- /dev/null
+++ b/test/unit/webviews/workspaces/panelProvider.test.ts
@@ -0,0 +1,295 @@
+import { describe, expect, it, onTestFinished, vi } from "vitest";
+import * as vscode from "vscode";
+
+import { WorkspacesPanelProvider } from "@/webviews/workspaces/panelProvider";
+import { WorkspaceStore } from "@/webviews/workspaces/workspaceStore";
+
+import {
+	agent,
+	agentMetadata,
+	PENDING_METADATA,
+	REPORTED_METADATA,
+	workspace,
+} from "@repo/mocks";
+import {
+	WorkspacesApi,
+	type CommandDef,
+	type OpenWorkspaceParams,
+	type WorkspacesState,
+} from "@repo/shared";
+
+import {
+	createMockLogger,
+	createMockWebviewView,
+	flushPromises,
+	MockCancellationToken,
+	MockConfigurationProvider,
+	MockWorkspacesClient,
+	TestSessionStore,
+} from "../../../mocks/testHelpers";
+
+import type { Workspace } from "coder/site/src/api/typesGenerated";
+
+import type { Commands } from "@/commands";
+
+const alice = () =>
+	workspace({
+		id: "workspace-1",
+		name: "dev",
+		owner_name: "alice",
+		agents: [agent({ id: "agent-1", name: "main" })],
+	});
+
+const isState = (m: unknown): m is { data: WorkspacesState } =>
+	(m as { type?: string }).type === WorkspacesApi.stateChanged.method;
+
+/** Each state as `[status, workspace ids]`, so a list is easy to read. */
+const listings = (states: WorkspacesState[]) =>
+	states.map((s) => [s.status.kind, s.workspaces.map((w) => w.id)]);
+
+function setup() {
+	vi.clearAllMocks();
+	new MockConfigurationProvider();
+	const client = new MockWorkspacesClient();
+	const store = new WorkspaceStore(
+		client,
+		createMockLogger(),
+		new TestSessionStore(),
+	);
+	const commands = {
+		openWorkspaceFromSidebar: vi.fn(() => Promise.resolve()),
+		openWorkspaceInDashboard: vi.fn(() => Promise.resolve()),
+	} satisfies Pick<
+		Commands,
+		"openWorkspaceFromSidebar" | "openWorkspaceInDashboard"
+	>;
+	const provider = new WorkspacesPanelProvider(
+		vscode.Uri.file("/test"),
+		store,
+		commands,
+		createMockLogger(),
+	);
+	onTestFinished(() => {
+		provider.dispose();
+		store.dispose();
+	});
+
+	/** Resolve a view, as VS Code does when the panel is (re)opened. */
+	const resolveView = (
+		options: { cancelled?: boolean; visible?: boolean } = {},
+	) => {
+		const { view, hooks } = createMockWebviewView(
+			WorkspacesPanelProvider.viewType,
+			options,
+		);
+		provider.resolveWebviewView(
+			view,
+			{} as vscode.WebviewViewResolveContext,
+			new MockCancellationToken(options.cancelled),
+		);
+		return {
+			view,
+			hooks,
+			/** Send a command from the webview and wait for its handler. */
+			send: async <P>(
+				def: CommandDef<P>,
+				...args: P extends void ? [] : [params: P]
+			) => {
+				hooks.sendFromWebview({ method: def.method, params: args[0] });
+				await flushPromises();
+				await store.settled;
+			},
+			pushed: (): WorkspacesState[] =>
+				hooks.postedMessages.filter(isState).map(({ data }) => data),
+		};
+	};
+
+	return { client, store, commands, provider, resolveView, ...resolveView() };
+}
+
+/** A visible panel, answering its first lists with `responses`, in order. */
+async function shown(...responses: Workspace[][]) {
+	const h = setup();
+	responses.forEach((listed) => h.client.respondOnce(listed));
+	h.hooks.setVisible(true);
+	await h.store.settled;
+	h.hooks.clearPostedMessages();
+	return h;
+}
+
+type Panel = Awaited<ReturnType<typeof shown>>;
+
+describe("WorkspacesPanelProvider", () => {
+	it("renders the bundle, and answers ready with the state it has", async () => {
+		const h = await shown([alice()]);
+		expect(h.view.webview.html).toContain("Coder Workspaces");
+		await h.send(WorkspacesApi.ready);
+		expect(listings(h.pushed())).toEqual([["ready", ["workspace-1"]]]);
+		expect(h.client.getWorkspaces).toHaveBeenCalledTimes(1);
+	});
+
+	it("pushes the whole state on every change", async () => {
+		const h = await shown();
+		h.client.respondOnce([alice()]);
+		await h.send(WorkspacesApi.refresh);
+		expect(listings(h.pushed())).toEqual([
+			["loading", []],
+			["ready", ["workspace-1"]],
+		]);
+	});
+
+	it("pushes only the fresh list on reveal, since the webview kept the rest", async () => {
+		const h = await shown();
+		h.hooks.setVisible(false);
+		h.client.respondOnce([alice()]);
+		h.hooks.setVisible(true);
+		await h.store.settled;
+		expect(listings(h.pushed())).toEqual([["ready", ["workspace-1"]]]);
+	});
+
+	it("keeps a hidden webview current", async () => {
+		const h = await shown([alice()]);
+		await h.send(WorkspacesApi.watchAgents, { agentIds: ["agent-1"] });
+		h.hooks.setVisible(false);
+		h.hooks.clearPostedMessages();
+		h.client.metadataStream("agent-1").pushMessage({ data: [agentMetadata()] });
+		expect(h.pushed().map((s) => s.metadata)).toEqual([
+			{ "agent-1": REPORTED_METADATA },
+		]);
+	});
+
+	it("stops watching the agents a webview expanded once it reloads", async () => {
+		const h = await shown([alice()]);
+		await h.send(WorkspacesApi.watchAgents, { agentIds: ["agent-1"] });
+		await h.send(WorkspacesApi.ready);
+		expect(h.pushed().at(-1)?.metadata).toEqual({});
+		expect(h.store.state.metadata).toEqual({});
+	});
+
+	describe("lifecycle", () => {
+		interface TeardownCase {
+			name: string;
+			teardown: (h: Panel) => void;
+		}
+
+		it.each<TeardownCase>([
+			{
+				name: "the provider is disposed",
+				teardown: (h) => h.provider.dispose(),
+			},
+			{ name: "the view is destroyed", teardown: (h) => h.hooks.fireDispose() },
+		])("stops listing and pushing when $name", async ({ teardown }) => {
+			const h = await shown();
+			teardown(h);
+			// Only a store that was left hidden lists again when revealed.
+			await h.store.setVisible(true);
+			expect(h.client.getWorkspaces).toHaveBeenCalledTimes(2);
+			expect(h.pushed()).toEqual([]);
+		});
+
+		it("hands the panel to the newest view, even once the old one is destroyed", async () => {
+			const h = await shown();
+			const next = h.resolveView();
+			await h.send(WorkspacesApi.ready);
+			h.hooks.fireDispose();
+			await next.send(WorkspacesApi.ready);
+			expect(h.pushed()).toEqual([]);
+			expect(listings(next.pushed())).toEqual([["ready", []]]);
+		});
+
+		it("keeps listing and watching when a visible view replaces another", async () => {
+			const h = await shown([alice()]);
+			await h.send(WorkspacesApi.watchAgents, { agentIds: ["agent-1"] });
+			h.resolveView({ visible: true });
+			expect(h.client.getWorkspaces).toHaveBeenCalledTimes(1);
+			expect(h.store.state.metadata).toEqual({ "agent-1": PENDING_METADATA });
+		});
+
+		it("resolves nothing once the request is cancelled", async () => {
+			const h = await shown();
+			const cancelled = h.resolveView({ cancelled: true });
+			expect(cancelled.view.webview.html).toBe("");
+			await cancelled.send(WorkspacesApi.ready);
+			expect(cancelled.pushed()).toEqual([]);
+			await h.send(WorkspacesApi.ready);
+			expect(h.pushed()).toHaveLength(1);
+		});
+	});
+
+	it("ignores an unrecognized message", async () => {
+		const h = await shown();
+		h.hooks.sendFromWebview({ method: "nope" });
+		await flushPromises();
+		expect(h.pushed()).toEqual([]);
+		expect(vscode.window.showErrorMessage).not.toHaveBeenCalled();
+	});
+
+	it("forwards commands to the store, and dashboard pages to Commands", async () => {
+		const h = await shown([alice()]);
+		await h.send(WorkspacesApi.watchAgents, { agentIds: ["agent-1"] });
+		expect([...h.client.metadataStreams.keys()]).toEqual(["agent-1"]);
+
+		const params = { workspaceId: "workspace-1", page: "settings" } as const;
+		await h.send(WorkspacesApi.viewInDashboard, params);
+		expect(h.commands.openWorkspaceInDashboard).toHaveBeenCalledWith(
+			expect.objectContaining({ name: "dev" }),
+			"settings",
+		);
+
+		await h.send(WorkspacesApi.setFilter, { filter: "shared" });
+		expect(h.store.state.filter).toBe("shared");
+	});
+
+	interface OpenCase {
+		name: string;
+		params: OpenWorkspaceParams;
+		agent?: string;
+	}
+
+	it.each<OpenCase>([
+		{ name: "the workspace", params: { workspaceId: "workspace-1" } },
+		{
+			name: "one of its agents",
+			params: { workspaceId: "workspace-1", agentId: "agent-1" },
+			agent: "main",
+		},
+	])("opens $name", async ({ params, agent: agentName }) => {
+		const h = await shown([alice()]);
+		await h.send(WorkspacesApi.openWorkspace, params);
+		expect(h.commands.openWorkspaceFromSidebar).toHaveBeenCalledWith(
+			expect.objectContaining({ name: "dev", owner_name: "alice" }),
+			agentName && expect.objectContaining({ name: agentName }),
+		);
+	});
+
+	interface FailedOpenCase {
+		name: string;
+		params: OpenWorkspaceParams;
+		reported: string;
+	}
+
+	it.each<FailedOpenCase>([
+		{
+			name: "a workspace that is gone",
+			params: { workspaceId: "gone" },
+			reported: "Workspace is no longer available",
+		},
+		{
+			name: "an agent that is gone",
+			params: { workspaceId: "workspace-1", agentId: "gone" },
+			reported: "Agent is no longer available",
+		},
+		{
+			name: "a connection that failed",
+			params: { workspaceId: "workspace-1" },
+			reported: "no SSH binary",
+		},
+	])("reports opening $name", async ({ params, reported }) => {
+		const h = await shown([alice()]);
+		h.commands.openWorkspaceFromSidebar.mockRejectedValueOnce(
+			new Error(reported),
+		);
+		await h.send(WorkspacesApi.openWorkspace, params);
+		expect(vscode.window.showErrorMessage).toHaveBeenCalledWith(reported);
+	});
+});
diff --git a/test/unit/webviews/workspaces/workspaceStore.test.ts b/test/unit/webviews/workspaces/workspaceStore.test.ts
new file mode 100644
index 0000000000..db2662adc6
--- /dev/null
+++ b/test/unit/webviews/workspaces/workspaceStore.test.ts
@@ -0,0 +1,325 @@
+import { describe, expect, it, onTestFinished, vi } from "vitest";
+
+import { WorkspaceStore } from "@/webviews/workspaces/workspaceStore";
+
+import {
+	agent,
+	agentMetadata,
+	REPORTED_METADATA,
+	workspace,
+} from "@repo/mocks";
+
+import {
+	createAxiosError,
+	createMockLogger,
+	MockWorkspacesClient,
+	TEST_DEPLOYMENT,
+	TestSessionStore,
+	userWithRoles,
+} from "../../../mocks/testHelpers";
+
+import type { Workspace, WorkspacesState } from "@repo/shared";
+
+/** The 400 a deployment answers with when it cannot run a filter's query. */
+const queryRejected = () => createAxiosError(400, "invalid query");
+
+const withAgent = () =>
+	workspace({ id: "workspace-1", agents: [agent({ id: "agent-1" })] });
+
+const ids = (state?: WorkspacesState) => state?.workspaces.map((w) => w.id);
+
+function setup() {
+	const client = new MockWorkspacesClient();
+	const session = new TestSessionStore();
+	const store = new WorkspaceStore(client, createMockLogger(), session);
+	onTestFinished(() => store.dispose());
+	const states: WorkspacesState[] = [];
+	store.onDidChange((state) => states.push(state));
+	return {
+		client,
+		session,
+		store,
+		states,
+		last: () => states.at(-1),
+		/** Answer the next lists with `responses`, then reveal the store. */
+		show: (...responses: Workspace[][]) => {
+			responses.forEach((listed) => client.respondOnce(listed));
+			return store.setVisible(true);
+		},
+	};
+}
+
+type Store = ReturnType<typeof setup>;
+
+async function shown(...responses: Workspace[][]) {
+	const h = setup();
+	await h.show(...responses);
+	return h;
+}
+
+async function watchingAgent() {
+	const h = await shown([withAgent()]);
+	await h.store.watchAgents(["agent-1"]);
+	return h;
+}
+
+const pushMetadata = (h: Store) =>
+	h.client.metadataStream("agent-1").pushMessage({ data: [agentMetadata()] });
+
+describe("WorkspaceStore", () => {
+	it("lists the signed-in user's workspaces once visible", async () => {
+		const h = setup();
+		await h.store.settled;
+		expect(h.states).toEqual([]);
+		expect(h.store.state.status).toEqual({ kind: "loading" });
+
+		await h.show([workspace({ id: "workspace-1" })]);
+		expect(h.client.getWorkspaces).toHaveBeenCalledWith({ q: "owner:me" });
+		expect(h.states).toEqual([
+			{
+				capabilities: { authenticated: true, filters: ["mine", "shared"] },
+				filter: "mine",
+				workspaces: [expect.objectContaining({ id: "workspace-1" })],
+				status: { kind: "ready" },
+				metadata: {},
+			},
+		]);
+		expect(h.store.findWorkspace("workspace-1")).toBeDefined();
+		expect(h.store.findWorkspace("gone")).toBeUndefined();
+	});
+
+	it("polls the filters that poll, saying nothing when nothing changed", async () => {
+		vi.useFakeTimers();
+		onTestFinished(() => {
+			vi.useRealTimers();
+		});
+		const second = () => [workspace({ id: "second" })];
+		const h = await shown([workspace({ id: "first" })], second(), second());
+
+		await vi.advanceTimersByTimeAsync(5_000);
+		expect(h.states.map(ids)).toEqual([["first"], ["second"]]);
+		await vi.advanceTimersByTimeAsync(5_000);
+		expect(h.states).toHaveLength(2);
+
+		await h.store.setFilter("shared");
+		const fetches = h.client.getWorkspaces.mock.calls.length;
+		await vi.advanceTimersByTimeAsync(60_000);
+		expect(h.client.getWorkspaces).toHaveBeenCalledTimes(fetches);
+	});
+
+	interface LoadingCase {
+		name: string;
+		act: (h: Store) => Promise<void>;
+	}
+
+	it.each<LoadingCase>([
+		{ name: "a filter switch", act: (h) => h.store.setFilter("shared") },
+		{ name: "a refresh", act: (h) => h.store.refresh() },
+	])("reports loading again for $name", async ({ act }) => {
+		const h = await shown();
+		await act(h);
+		expect(h.states.map((s) => s.status.kind)).toEqual([
+			"ready",
+			"loading",
+			"ready",
+		]);
+	});
+
+	it("lists the filter the webview selected, ignoring ones it does not offer", async () => {
+		const h = await shown();
+		await h.store.setFilter("all");
+		expect(h.client.getWorkspaces).toHaveBeenCalledTimes(1);
+
+		await h.store.setFilter("shared");
+		expect(h.client.getWorkspaces).toHaveBeenLastCalledWith({
+			q: "shared_with_user:current-user",
+		});
+		expect(h.last()?.filter).toBe("shared");
+	});
+
+	it("starts over for each session, offering the filters of whoever signed in", async () => {
+		const h = await shown();
+		h.session.signIn(TEST_DEPLOYMENT, userWithRoles("owner"));
+		await h.store.settled;
+		expect(h.last()?.capabilities.filters).toEqual(["mine", "shared", "all"]);
+		await h.store.setFilter("all");
+
+		h.session.signInAs("someone-else");
+		await h.store.settled;
+		expect(h.last()).toMatchObject({
+			capabilities: { filters: ["mine", "shared"] },
+			filter: "mine",
+			workspaces: [],
+		});
+
+		const fetches = h.client.getWorkspaces.mock.calls.length;
+		h.session.signOut();
+		await h.store.settled;
+		expect(h.client.getWorkspaces).toHaveBeenCalledTimes(fetches);
+		expect(h.last()).toMatchObject({
+			capabilities: { authenticated: false, filters: [] },
+			status: { kind: "ready" },
+		});
+	});
+
+	describe("failed fetches", () => {
+		it("reports a failure, then clears it once a fetch succeeds", async () => {
+			const h = await shown([workspace({ id: "workspace-1" })]);
+			h.client.getWorkspaces.mockRejectedValueOnce(new Error("network down"));
+			await h.store.refresh();
+			expect(h.last()).toMatchObject({
+				workspaces: [],
+				status: { kind: "failed", error: "network down" },
+			});
+
+			await h.store.refresh();
+			expect(h.last()?.status).toEqual({ kind: "ready" });
+		});
+
+		it("stops offering a filter the deployment rejects, until a visible refresh", async () => {
+			const h = await shown();
+			h.client.getWorkspaces.mockRejectedValueOnce(queryRejected());
+			h.client.respondOnce([workspace({ id: "workspace-1" })]);
+			await h.store.setFilter("shared");
+			// Falls back to a filter that loads instead of leaving a broken one.
+			expect(h.last()).toMatchObject({
+				capabilities: { filters: ["mine"] },
+				filter: "mine",
+				workspaces: [expect.objectContaining({ id: "workspace-1" })],
+				status: { kind: "ready" },
+			});
+
+			await h.store.setVisible(false);
+			await h.store.refresh();
+			expect(h.store.state.capabilities.filters).toEqual(["mine"]);
+
+			await h.store.setVisible(true);
+			await h.store.refresh();
+			expect(h.store.state.capabilities.filters).toEqual(["mine", "shared"]);
+		});
+
+		it("keeps the default filter when its query is rejected", async () => {
+			const h = setup();
+			h.client.getWorkspaces.mockRejectedValueOnce(queryRejected());
+			await h.show();
+			expect(h.store.state).toMatchObject({
+				capabilities: { filters: ["mine", "shared"] },
+				status: { kind: "failed", error: "invalid query" },
+			});
+		});
+	});
+
+	describe("agent metadata", () => {
+		it("watches the listed agents the webview asks for, and reports what arrives", async () => {
+			const h = await shown([withAgent()]);
+			expect(h.client.metadataStreams.size).toBe(0);
+			await h.store.watchAgents(["agent-1", "not-listed"]);
+			expect([...h.client.metadataStreams.keys()]).toEqual(["agent-1"]);
+
+			pushMetadata(h);
+			expect(h.last()?.metadata).toEqual({ "agent-1": REPORTED_METADATA });
+		});
+
+		it("keeps the sockets and their last report across a hide", async () => {
+			const h = await watchingAgent();
+			pushMetadata(h);
+			const opened = vi.spyOn(h.client, "watchAgentMetadata");
+			await h.store.setVisible(false);
+			await h.show([withAgent()]);
+			expect(opened).not.toHaveBeenCalled();
+			expect(h.last()?.metadata).toEqual({ "agent-1": REPORTED_METADATA });
+		});
+
+		it("keeps the workspaces when a metadata socket fails", async () => {
+			const h = setup();
+			vi.spyOn(h.client, "watchAgentMetadata").mockRejectedValue(
+				new Error("socket refused"),
+			);
+			await h.show([withAgent()]);
+			await h.store.watchAgents(["agent-1"]);
+			expect(h.last()).toMatchObject({
+				workspaces: [expect.objectContaining({ id: "workspace-1" })],
+				status: { kind: "ready" },
+				metadata: {
+					"agent-1": {
+						kind: "failed",
+						error: "Failed to query metadata: socket refused",
+					},
+				},
+			});
+		});
+
+		it("releases agents a failed list drops, and closes them once the session ends", async () => {
+			const h = await watchingAgent();
+			const socket = h.client.metadataStream("agent-1");
+			h.client.getWorkspaces.mockRejectedValueOnce(new Error("offline"));
+			await h.store.refresh();
+			expect(h.store.state.metadata).toEqual({});
+			expect(socket.close).not.toHaveBeenCalled();
+
+			h.session.signOut();
+			expect(socket.close).toHaveBeenCalledOnce();
+		});
+	});
+
+	describe("requests that outlive a hide", () => {
+		it("caches a response, and keeps it on reveal while the fresh list loads", async () => {
+			const h = await shown();
+			const pending = h.client.pending();
+			const fetching = h.store.refresh();
+			void h.store.setVisible(false);
+			pending.resolve([workspace({ id: "cached" })]);
+			await fetching;
+			expect(ids(h.store.state)).toEqual(["cached"]);
+
+			const next = h.client.pending();
+			const revealing = h.show();
+			expect(h.store.state).toMatchObject({
+				workspaces: [expect.objectContaining({ id: "cached" })],
+				status: { kind: "ready" },
+			});
+			next.resolve([]);
+			await revealing;
+		});
+
+		interface SettleCase {
+			name: string;
+			settle: (pending: ReturnType<MockWorkspacesClient["pending"]>) => void;
+		}
+
+		it.each<SettleCase>([
+			{ name: "resolves", settle: (p) => p.resolve([withAgent()]) },
+			{ name: "rejects", settle: (p) => p.reject(new Error("old failure")) },
+		])("ignores an old session's request when it $name", async ({ settle }) => {
+			const h = setup();
+			const pending = h.client.pending();
+			const fetching = h.show();
+			void h.store.setVisible(false);
+			h.session.signOut();
+			settle(pending);
+			await fetching;
+			expect(h.store.state).toMatchObject({
+				capabilities: { authenticated: false },
+				workspaces: [],
+				status: { kind: "ready" },
+				metadata: {},
+			});
+		});
+
+		it("invalidates a request when its filter changes", async () => {
+			const h = setup();
+			const pending = h.client.pending();
+			const fetching = h.show();
+			void h.store.setVisible(false);
+			await h.store.setFilter("shared");
+			pending.resolve([withAgent()]);
+			await fetching;
+			// Nothing lists while hidden, so the new filter is still loading.
+			expect(h.store.state).toMatchObject({
+				filter: "shared",
+				workspaces: [],
+				status: { kind: "loading" },
+			});
+		});
+	});
+});
diff --git a/test/unit/workspace/agentMetadataTracker.test.ts b/test/unit/workspace/agentMetadataTracker.test.ts
new file mode 100644
index 0000000000..66945779b4
--- /dev/null
+++ b/test/unit/workspace/agentMetadataTracker.test.ts
@@ -0,0 +1,227 @@
+import { describe, expect, it, onTestFinished, vi } from "vitest";
+
+import { AgentMetadataTracker } from "@/workspace/agentMetadataTracker";
+
+import {
+	agentMetadata,
+	PENDING_METADATA,
+	REPORTED_METADATA,
+} from "@repo/mocks";
+
+import {
+	MockEventStream,
+	MockWorkspacesClient,
+	type MockMetadataStream,
+} from "../../mocks/testHelpers";
+
+import type { AgentMetadataMap, AgentMetadataState } from "@repo/shared";
+
+const LINGER_MS = 1_000;
+
+const failed = (cause: string): AgentMetadataState => ({
+	kind: "failed",
+	error: `Failed to query metadata: ${cause}`,
+});
+
+const died = { code: 1006, reason: "", wasClean: false };
+
+/** A tracker watching `agents`, on fake timers, spying on the sockets it opens. */
+async function setup(...agents: string[]) {
+	vi.useFakeTimers();
+	const client = new MockWorkspacesClient();
+	const tracker = new AgentMetadataTracker(client, LINGER_MS);
+	onTestFinished(() => {
+		tracker.dispose();
+		vi.useRealTimers();
+	});
+	const reports: AgentMetadataMap[] = [];
+	tracker.onDidChange(() => reports.push(tracker.metadata));
+	const opened = vi.spyOn(client, "watchAgentMetadata");
+	await tracker.watch(agents);
+	return {
+		client,
+		tracker,
+		reports,
+		opened,
+		stream: client.metadataStream.bind(client),
+	};
+}
+
+describe("AgentMetadataTracker", () => {
+	it("reports the agents it was given, with one socket each", async () => {
+		const { opened, tracker, reports } = await setup("agent-1", "agent-2");
+		await tracker.watch(["agent-2", "agent-3"]);
+		expect(reports).toEqual([
+			{ "agent-1": PENDING_METADATA, "agent-2": PENDING_METADATA },
+			{ "agent-2": PENDING_METADATA, "agent-3": PENDING_METADATA },
+		]);
+		expect(opened.mock.calls.map(([id]) => id)).toEqual([
+			"agent-1",
+			"agent-2",
+			"agent-3",
+		]);
+	});
+
+	interface ReportCase {
+		name: string;
+		send: (stream: MockMetadataStream) => void;
+		reported: AgentMetadataState;
+	}
+
+	it.each<ReportCase>([
+		{
+			name: "metadata",
+			send: (stream) => stream.pushMessage({ data: [agentMetadata()] }),
+			reported: REPORTED_METADATA,
+		},
+		{
+			name: "a failure",
+			send: (stream) => stream.pushError(new Error("boom")),
+			reported: failed("boom"),
+		},
+	])("reports $name an agent sends", async ({ send, reported }) => {
+		const { tracker, stream } = await setup("agent-1");
+		send(stream("agent-1"));
+		expect(tracker.metadata).toEqual({ "agent-1": reported });
+	});
+
+	it("keeps a released socket for a while, reporting only what is watched", async () => {
+		const { tracker, reports, stream } = await setup("agent-1", "agent-2");
+		const released = stream("agent-1");
+		await tracker.watch(["agent-2"]);
+		expect(reports.at(-1)).toEqual({ "agent-2": PENDING_METADATA });
+		expect(released.close).not.toHaveBeenCalled();
+
+		const reported = reports.length;
+		released.pushMessage({ data: [agentMetadata()] });
+		expect(reports).toHaveLength(reported);
+
+		vi.advanceTimersByTime(LINGER_MS);
+		expect(released.close).toHaveBeenCalled();
+	});
+
+	it("reuses a lingering socket, with what it already reported", async () => {
+		const { opened, tracker, stream } = await setup("agent-1");
+		stream("agent-1").pushMessage({ data: [agentMetadata()] });
+		for (let i = 0; i < 5; i++) {
+			await tracker.watch([]);
+			vi.advanceTimersByTime(LINGER_MS / 2);
+			await tracker.watch(["agent-1"]);
+		}
+		expect(opened).toHaveBeenCalledTimes(1);
+		expect(tracker.metadata).toEqual({ "agent-1": REPORTED_METADATA });
+	});
+
+	it("reports a socket that never opened, and retries it", async () => {
+		const { client, opened, tracker } = await setup();
+		opened.mockRejectedValueOnce(new Error("socket refused"));
+		await tracker.watch(["agent-1"]);
+		expect(tracker.metadata).toEqual({ "agent-1": failed("socket refused") });
+
+		await tracker.watch(["agent-1"]);
+		expect(client.metadataStreams.has("agent-1")).toBe(true);
+	});
+
+	it("reopens a socket that died, ignoring what the old one still says", async () => {
+		const { opened, tracker, stream } = await setup("agent-1");
+		const old = stream("agent-1");
+		old.emit("close", died);
+		old.close.mockImplementation(() => old.pushError(new Error("closing")));
+		await tracker.watch(["agent-1"]);
+		expect(opened).toHaveBeenCalledTimes(2);
+
+		stream("agent-1").pushMessage({ data: [agentMetadata()] });
+		old.pushError(new Error("stale"));
+		expect(tracker.metadata).toEqual({ "agent-1": REPORTED_METADATA });
+	});
+
+	it("clears every socket at once, and closes for good once disposed", async () => {
+		const { client, tracker, reports, opened } = await setup(
+			"agent-1",
+			"agent-2",
+		);
+		await tracker.watch(["agent-1"]);
+		tracker.clear();
+		for (const socket of client.metadataStreams.values()) {
+			expect(socket.close).toHaveBeenCalledOnce();
+		}
+		expect(reports.at(-1)).toEqual({});
+		await tracker.watch(["agent-1"]);
+		expect(opened).toHaveBeenCalledTimes(3);
+
+		const reported = reports.length;
+		tracker.dispose();
+		client.metadataStream("agent-1").pushMessage({ data: [agentMetadata()] });
+		await tracker.watch(["agent-3"]);
+		expect(reports).toHaveLength(reported);
+		expect(opened).toHaveBeenCalledTimes(3);
+	});
+
+	describe("races", () => {
+		it("joins overlapping opens for the same agent", async () => {
+			const { tracker, opened } = await setup();
+			const pending = Promise.withResolvers<MockMetadataStream>();
+			opened.mockReturnValueOnce(pending.promise);
+			const first = tracker.watch(["agent-1"]);
+			const second = tracker.watch(["agent-1"]);
+			expect(opened).toHaveBeenCalledOnce();
+			pending.resolve(new MockEventStream());
+			await Promise.all([first, second]);
+		});
+
+		interface StaleOpenCase {
+			expiry: string;
+			expire: (tracker: AgentMetadataTracker) => void | Promise<void>;
+			outcome: "resolves" | "rejects";
+		}
+
+		const expiries: Record<string, StaleOpenCase["expire"]> = {
+			"lingered out": async (tracker) => {
+				await tracker.watch([]);
+				vi.advanceTimersByTime(LINGER_MS);
+			},
+			"was cleared": (tracker) => tracker.clear(),
+			"was disposed": (tracker) => tracker.dispose(),
+		};
+
+		it.each<StaleOpenCase>(
+			Object.entries(expiries).flatMap(([expiry, expire]) => [
+				{ expiry, expire, outcome: "resolves" },
+				{ expiry, expire, outcome: "rejects" },
+			]),
+		)(
+			"drops the open of an agent that $expiry when it $outcome",
+			async ({ expire, outcome }) => {
+				const { tracker, opened } = await setup();
+				const pending = Promise.withResolvers<MockMetadataStream>();
+				opened.mockReturnValueOnce(pending.promise);
+				const stale = tracker.watch(["agent-1"]);
+				await expire(tracker);
+
+				const old: MockMetadataStream = new MockEventStream();
+				if (outcome === "resolves") pending.resolve(old);
+				else pending.reject(new Error("stale error"));
+				await stale;
+
+				expect(old.close).toHaveBeenCalledTimes(outcome === "resolves" ? 1 : 0);
+				expect(tracker.metadata).toEqual({});
+			},
+		);
+
+		it("replays data received before the tracker subscribes", async () => {
+			const { tracker, opened } = await setup();
+			const socket: MockMetadataStream = new MockEventStream();
+			const add = socket.addEventListener.bind(socket);
+			vi.spyOn(socket, "addEventListener").mockImplementation(
+				(event, listener) => {
+					add(event, listener);
+					if (event === "message")
+						socket.pushMessage({ data: [agentMetadata()] });
+				},
+			);
+			opened.mockResolvedValueOnce(socket);
+			await tracker.watch(["agent-1"]);
+			expect(tracker.metadata).toEqual({ "agent-1": REPORTED_METADATA });
+		});
+	});
+});
diff --git a/test/unit/workspace/filters.test.ts b/test/unit/workspace/filters.test.ts
new file mode 100644
index 0000000000..8c2f5088db
--- /dev/null
+++ b/test/unit/workspace/filters.test.ts
@@ -0,0 +1,67 @@
+import { describe, expect, it } from "vitest";
+
+import {
+	availableFilters,
+	isQueryRejected,
+	WORKSPACE_FILTERS,
+} from "@/workspace/filters";
+
+import {
+	createAxiosError,
+	signedInSession,
+	userWithRoles,
+} from "../../mocks/testHelpers";
+
+import type { SessionData } from "@/deployment/sessionStore";
+
+import type { WorkspaceFilter } from "@repo/shared";
+
+const MEMBER = signedInSession();
+const OWNER = signedInSession(userWithRoles("owner"));
+const SIGNED_OUT: SessionData = { kind: "signedOut", deployment: null };
+
+describe("WORKSPACE_FILTERS", () => {
+	interface QueryCase {
+		filter: WorkspaceFilter;
+		query: string;
+	}
+
+	it.each<QueryCase>([
+		{ filter: "mine", query: "owner:me" },
+		{ filter: "shared", query: `shared_with_user:${MEMBER.user.id}` },
+		{ filter: "all", query: "" },
+	])("queries $filter workspaces", ({ filter, query }) => {
+		expect(WORKSPACE_FILTERS[filter].getQuery(MEMBER)).toBe(query);
+	});
+});
+
+describe("availableFilters", () => {
+	interface OfferCase {
+		name: string;
+		session: SessionData;
+		unsupported?: WorkspaceFilter[];
+		offered: WorkspaceFilter[];
+	}
+
+	it.each<OfferCase>([
+		{ name: "signed out", session: SIGNED_OUT, offered: [] },
+		{ name: "a member", session: MEMBER, offered: ["mine", "shared"] },
+		{ name: "an owner", session: OWNER, offered: ["mine", "shared", "all"] },
+		{
+			name: "an owner whose deployment rejected one",
+			session: OWNER,
+			unsupported: ["shared"],
+			offered: ["mine", "all"],
+		},
+	])("offers $name $offered", ({ session, unsupported, offered }) => {
+		expect(availableFilters(session, new Set(unsupported))).toEqual(offered);
+	});
+});
+
+describe("isQueryRejected", () => {
+	it("recognizes only a 400 from the deployment", () => {
+		expect(isQueryRejected(createAxiosError(400, "invalid query"))).toBe(true);
+		expect(isQueryRejected(createAxiosError(500, "down"))).toBe(false);
+		expect(isQueryRejected(new Error("offline"))).toBe(false);
+	});
+});
diff --git a/test/unit/workspace/workspacesProvider.test.ts b/test/unit/workspace/workspacesProvider.test.ts
index d0de4e95f1..62e1019651 100644
--- a/test/unit/workspace/workspacesProvider.test.ts
+++ b/test/unit/workspace/workspacesProvider.test.ts
@@ -3,7 +3,6 @@ import * as vscode from "vscode";
 
 import {
 	WorkspaceProvider,
-	WorkspaceQuery,
 	type AgentTreeItem,
 	type WorkspaceTreeItem,
 } from "@/workspace/workspacesProvider";
@@ -30,13 +29,15 @@ import type {
 import type { AgentMetadataEvent } from "@/api/api-helper";
 import type { CoderApi } from "@/api/coderApi";
 
+import type { WorkspaceFilter } from "@repo/shared";
+
 function setup() {
 	const logger = createMockLogger();
 	const client = new MockWorkspacesClient();
 	const session = new TestSessionStore();
 	const makeProvider = (
-		query: WorkspaceQuery,
-		options?: { refreshIntervalMs?: number; onQueryRejected?: () => void },
+		query: WorkspaceFilter,
+		options?: { onQueryRejected?: () => void },
 	): WorkspaceProvider =>
 		new WorkspaceProvider(
 			query,
@@ -128,7 +129,7 @@ describe("WorkspaceProvider", () => {
 	it("does not fetch while signed out", async () => {
 		const { client, session, makeProvider } = setup();
 		session.signOut();
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 
@@ -136,10 +137,10 @@ describe("WorkspaceProvider", () => {
 		expect(await provider.getChildren()).toEqual([]);
 	});
 
-	it.each([
-		[WorkspaceQuery.Mine, "owner:me"],
-		[WorkspaceQuery.Shared, `shared_with_user:${TEST_CURRENT_USER_ID}`],
-		[WorkspaceQuery.All, ""],
+	it.each<[WorkspaceFilter, string]>([
+		["mine", "owner:me"],
+		["shared", `shared_with_user:${TEST_CURRENT_USER_ID}`],
+		["all", ""],
 	])("fetches %s with the expected query", async (query, expectedQuery) => {
 		const { client, makeProvider } = setup();
 		const provider = makeProvider(query);
@@ -149,19 +150,23 @@ describe("WorkspaceProvider", () => {
 		expect(client.getWorkspaces).toHaveBeenCalledWith({ q: expectedQuery });
 	});
 
-	it.each([
+	it.each<{
+		query: WorkspaceFilter;
+		label: string;
+		collapsibleState: vscode.TreeItemCollapsibleState;
+	}>([
 		{
-			query: WorkspaceQuery.Mine,
+			query: "mine",
 			label: "dev",
 			collapsibleState: vscode.TreeItemCollapsibleState.Expanded,
 		},
 		{
-			query: WorkspaceQuery.Shared,
+			query: "shared",
 			label: "alice / dev",
 			collapsibleState: vscode.TreeItemCollapsibleState.Collapsed,
 		},
 		{
-			query: WorkspaceQuery.All,
+			query: "all",
 			label: "alice / dev",
 			collapsibleState: vscode.TreeItemCollapsibleState.Collapsed,
 		},
@@ -198,7 +203,7 @@ describe("WorkspaceProvider", () => {
 				response: { status: 400 },
 			}),
 		);
-		const provider = makeProvider(WorkspaceQuery.Shared, { onQueryRejected });
+		const provider = makeProvider("shared", { onQueryRejected });
 
 		await show(provider);
 
@@ -210,7 +215,7 @@ describe("WorkspaceProvider", () => {
 		const { client, makeProvider } = setup();
 		const onQueryRejected = vi.fn();
 		client.getWorkspaces.mockRejectedValueOnce(new Error("network down"));
-		const provider = makeProvider(WorkspaceQuery.Shared, { onQueryRejected });
+		const provider = makeProvider("shared", { onQueryRejected });
 
 		await show(provider);
 
@@ -220,7 +225,7 @@ describe("WorkspaceProvider", () => {
 	it("clears rendered workspaces when the session signs out", async () => {
 		const { client, session, makeProvider } = setup();
 		client.respondOnce([workspace({ name: "dev" })]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		expect(await labels(provider)).toEqual(["dev"]);
@@ -234,7 +239,7 @@ describe("WorkspaceProvider", () => {
 	it("does not render a pending response after sign-out", async () => {
 		const { client, session, makeProvider } = setup();
 		const pending = client.pending();
-		const provider = makeProvider(WorkspaceQuery.Shared);
+		const provider = makeProvider("shared");
 
 		provider.setVisibility(true);
 		await flush();
@@ -251,7 +256,7 @@ describe("WorkspaceProvider", () => {
 		client.respondOnce([
 			workspace({ owner_id: "alice-id", owner_name: "alice", name: "fresh" }),
 		]);
-		const provider = makeProvider(WorkspaceQuery.Shared);
+		const provider = makeProvider("shared");
 
 		provider.setVisibility(true);
 		await flush();
@@ -267,7 +272,7 @@ describe("WorkspaceProvider", () => {
 
 	it("does not fetch while hidden", async () => {
 		const { client, makeProvider } = setup();
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await provider.fetchAndRefresh();
 
@@ -277,7 +282,7 @@ describe("WorkspaceProvider", () => {
 	it("renders a response that completes after the tree is hidden", async () => {
 		const { client, makeProvider } = setup();
 		const pending = client.pending();
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		provider.setVisibility(true);
 		await flush();
@@ -292,7 +297,7 @@ describe("WorkspaceProvider", () => {
 		const { client, session, makeProvider } = setup();
 		const pending = client.pending();
 		client.respondOnce([workspace({ name: "fresh" })]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		provider.setVisibility(true);
 		await flush();
@@ -311,7 +316,7 @@ describe("WorkspaceProvider", () => {
 		const { client, makeProvider } = setup();
 		client.respondOnce([workspace({ name: "dev" })]);
 		client.getWorkspaces.mockRejectedValueOnce(new Error("network down"));
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		expect(await labels(provider)).toEqual(["dev"]);
@@ -327,9 +332,7 @@ describe("WorkspaceProvider", () => {
 			const { client, makeProvider } = setup();
 			client.respondOnce([workspace({ name: "first" })]);
 			client.respondOnce([workspace({ name: "second" })]);
-			const provider = makeProvider(WorkspaceQuery.Mine, {
-				refreshIntervalMs: 5_000,
-			});
+			const provider = makeProvider("mine");
 
 			provider.setVisibility(true);
 			await flushPromises();
@@ -352,7 +355,7 @@ describe("WorkspaceProvider", () => {
 				agent({ id: "agent-2", name: "sidecar", status: "disconnected" }),
 			]),
 		]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		const [workspaceItem] =
@@ -386,7 +389,7 @@ describe("WorkspaceProvider", () => {
 				}),
 			]),
 		]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		const [workspaceItem] =
@@ -414,7 +417,7 @@ describe("WorkspaceProvider", () => {
 				agent({ id: "agent-1", name: "main" }),
 			]),
 		]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		const [workspaceItem] =
@@ -440,7 +443,7 @@ describe("WorkspaceProvider", () => {
 		client.respondOnce([
 			workspaceWithAgents({ name: "dev" }, [agent({ id: "agent-1" })]),
 		]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		expect(await labels(provider)).toEqual(["dev"]);
@@ -454,7 +457,7 @@ describe("WorkspaceProvider", () => {
 		const { client, session, makeProvider } = setup();
 		session.signOut();
 		client.respondOnce([workspace({ name: "dev" })]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		expect(client.getWorkspaces).not.toHaveBeenCalled();
@@ -468,7 +471,7 @@ describe("WorkspaceProvider", () => {
 	it("stops reacting to session changes after dispose", async () => {
 		const { client, session, makeProvider } = setup();
 		client.respondOnce([workspace({ name: "dev" })]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		await show(provider);
 		expect(await labels(provider)).toEqual(["dev"]);
@@ -485,7 +488,7 @@ describe("WorkspaceProvider", () => {
 		const { client, session, makeProvider } = setup();
 		const pending = client.pending();
 		client.getWorkspaces.mockRejectedValueOnce(new Error("network down"));
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		provider.setVisibility(true);
 		await flush();
@@ -508,7 +511,7 @@ describe("WorkspaceProvider", () => {
 		const first = client.pending();
 		const second = client.pending();
 		client.respondOnce([workspace({ name: "fresh" })]);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		provider.setVisibility(true);
 		await flush();
@@ -541,7 +544,7 @@ describe("WorkspaceProvider", () => {
 		const watch =
 			Promise.withResolvers<MockEventStream<{ data: AgentMetadataEvent[] }>>();
 		client.watchAgentMetadata = vi.fn((_agentId: string) => watch.promise);
-		const provider = makeProvider(WorkspaceQuery.Mine);
+		const provider = makeProvider("mine");
 
 		provider.setVisibility(true);
 		await flush();
diff --git a/test/utils/platform.ts b/test/utils/platform.ts
index 666f5f4a4c..26320e3766 100644
--- a/test/utils/platform.ts
+++ b/test/utils/platform.ts
@@ -123,8 +123,9 @@ export function quoteCommand(value: string): string {
 	return `${quote}${value}${quote}`;
 }
 
-export function expectPathsEqual(actual: string, expected: string) {
-	expect(normalizePath(actual)).toBe(normalizePath(expected));
+export function expectPathsEqual(actual: string | undefined, expected: string) {
+	expect(actual).toBeDefined();
+	expect(normalizePath(actual!)).toBe(normalizePath(expected));
 }
 
 function normalizePath(p: string): string {
diff --git a/test/webview/setup.ts b/test/webview/setup.ts
index e224ca8d19..e309e6fac7 100644
--- a/test/webview/setup.ts
+++ b/test/webview/setup.ts
@@ -25,6 +25,11 @@ globalThis.ResizeObserver = class {
 	disconnect() {}
 };
 
+// jsdom lacks the pointer-capture and scrolling APIs Radix Select uses.
+HTMLElement.prototype.hasPointerCapture = vi.fn();
+HTMLElement.prototype.releasePointerCapture = vi.fn();
+HTMLElement.prototype.scrollIntoView = vi.fn();
+
 // jsdom has no Canvas 2D; return a Proxy that accepts any prop read or method
 // call. measureText and createLinearGradient must return real shapes because
 // the caller reads fields off them.
diff --git a/test/webview/ui/components.test.tsx b/test/webview/ui/components.test.tsx
index b27cdac4bc..4080cccbe3 100644
--- a/test/webview/ui/components.test.tsx
+++ b/test/webview/ui/components.test.tsx
@@ -1,5 +1,5 @@
 import { fireEvent, render, screen } from "@testing-library/react";
-import { createRef, useState } from "react";
+import userEvent from "@testing-library/user-event";
 import { describe, expect, it, vi } from "vitest";
 
 import {
@@ -8,9 +8,9 @@ import {
 	Icon,
 	IconButton,
 	ProgressBar,
-	SearchInput,
 	Spinner,
 	StatusPill,
+	TooltipProvider,
 } from "@repo/ui";
 
 import { qs } from "../helpers";
@@ -47,6 +47,24 @@ describe("IconButton", () => {
 		fireEvent.click(screen.getByRole("button", { name: "Refresh" }));
 		expect(onClick).toHaveBeenCalledOnce();
 	});
+	it("hovers with the label unless opted out", async () => {
+		const hoverText = async (
+			tooltip?: string | null,
+		): Promise<string | undefined> => {
+			const view = render(
+				<TooltipProvider delayDuration={0}>
+					<IconButton icon="refresh" label="Refresh" tooltip={tooltip} />
+				</TooltipProvider>,
+			);
+			await userEvent.hover(screen.getByRole("button"));
+			const text = screen.queryByRole("tooltip")?.textContent ?? undefined;
+			view.unmount();
+			return text;
+		};
+		expect(await hoverText()).toBe("Refresh");
+		expect(await hoverText("Reload the list")).toBe("Reload the list");
+		expect(await hoverText(null)).toBeUndefined();
+	});
 });
 
 describe("Spinner", () => {
@@ -75,68 +93,6 @@ describe("ProgressBar", () => {
 	});
 });
 
-describe("SearchInput", () => {
-	it("reports changes without owning the value", () => {
-		const onChange = vi.fn();
-		const { rerender } = render(<SearchInput value="" onChange={onChange} />);
-		fireEvent.change(screen.getByRole("searchbox", { name: "Search" }), {
-			target: { value: "prod" },
-		});
-		expect(onChange).toHaveBeenCalledWith("prod");
-		expect(screen.getByRole("searchbox", { name: "Search" })).toHaveValue("");
-
-		rerender(<SearchInput value="prod" onChange={onChange} />);
-		expect(screen.getByRole("searchbox", { name: "Search" })).toHaveValue(
-			"prod",
-		);
-	});
-
-	it("clears through the same callback and returns focus after rerender", () => {
-		const onChange = vi.fn();
-		const ControlledSearch = (): React.JSX.Element => {
-			const [value, setValue] = useState("prod");
-			return (
-				<SearchInput
-					value={value}
-					onChange={(nextValue) => {
-						onChange(nextValue);
-						setValue(nextValue);
-					}}
-				/>
-			);
-		};
-		render(<ControlledSearch />);
-		fireEvent.click(screen.getByRole("button", { name: "Clear search" }));
-		expect(onChange).toHaveBeenCalledWith("");
-		expect(screen.getByRole("searchbox", { name: "Search" })).toHaveFocus();
-	});
-
-	it("exposes the input through a consumer ref alongside the internal one", () => {
-		const ref = createRef<HTMLInputElement>();
-		render(<SearchInput value="prod" onChange={vi.fn()} ref={ref} />);
-		expect(ref.current).toBe(screen.getByRole("searchbox", { name: "Search" }));
-
-		fireEvent.click(screen.getByRole("button", { name: "Clear search" }));
-		expect(screen.getByRole("searchbox", { name: "Search" })).toHaveFocus();
-	});
-
-	it("forwards className and style to the root element", () => {
-		render(
-			<SearchInput
-				value=""
-				onChange={vi.fn()}
-				className="custom-search"
-				style={{ width: "200px" }}
-			/>,
-		);
-		const root = screen
-			.getByRole("searchbox", { name: "Search" })
-			.closest(".ui-search-input");
-		expect(root).toHaveClass("custom-search");
-		expect(root).toHaveStyle({ width: "200px" });
-	});
-});
-
 describe("StatusPill", () => {
 	it("applies the requested generic tone", () => {
 		render(<StatusPill tone="danger">Failed</StatusPill>);
diff --git a/test/webview/ui/forms.test.tsx b/test/webview/ui/forms.test.tsx
new file mode 100644
index 0000000000..a1aa0291b7
--- /dev/null
+++ b/test/webview/ui/forms.test.tsx
@@ -0,0 +1,311 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { type ComponentProps, createRef, useState } from "react";
+import { describe, expect, it, vi } from "vitest";
+
+import {
+	Checkbox,
+	Field,
+	Input,
+	PasswordInput,
+	SearchInput,
+	Select,
+	SelectContent,
+	SelectItem,
+	SelectTrigger,
+	SelectValue,
+	Textarea,
+} from "@repo/ui";
+
+import { qs } from "../helpers";
+
+const ROOT_STYLING = { className: "custom-root", style: { width: "200px" } };
+
+interface TextControlCase {
+	name: string;
+	role: string;
+	control: (
+		value: string,
+		onChange: (value: string) => void,
+	) => React.JSX.Element;
+}
+
+describe("text controls", () => {
+	it.each<TextControlCase>([
+		{
+			name: "Input",
+			role: "textbox",
+			control: (value, onChange) => (
+				<Input value={value} onChange={onChange} aria-label="Region" />
+			),
+		},
+		{
+			name: "Textarea",
+			role: "textbox",
+			control: (value, onChange) => (
+				<Textarea value={value} onChange={onChange} aria-label="Region" />
+			),
+		},
+		{
+			name: "SearchInput",
+			role: "searchbox",
+			control: (value, onChange) => (
+				<SearchInput value={value} onChange={onChange} />
+			),
+		},
+	])("$name reports changes without owning the value", ({ role, control }) => {
+		const onChange = vi.fn();
+		const { rerender } = render(control("", onChange));
+		fireEvent.change(screen.getByRole(role), { target: { value: "next" } });
+		expect(onChange).toHaveBeenCalledWith("next");
+		expect(screen.getByRole(role)).toHaveValue("");
+
+		rerender(control("next", onChange));
+		expect(screen.getByRole(role)).toHaveValue("next");
+	});
+});
+
+interface RootStylingCase {
+	name: string;
+	root: string;
+	ui: React.JSX.Element;
+}
+
+describe("root styling", () => {
+	it.each<RootStylingCase>([
+		{
+			name: "Input",
+			root: ".ui-input",
+			ui: (
+				<Input
+					value=""
+					onChange={vi.fn()}
+					aria-label="Region"
+					{...ROOT_STYLING}
+				/>
+			),
+		},
+		{
+			name: "Textarea",
+			root: ".ui-textarea",
+			ui: (
+				<Textarea
+					value=""
+					onChange={vi.fn()}
+					aria-label="Region"
+					{...ROOT_STYLING}
+				/>
+			),
+		},
+		{
+			name: "SearchInput",
+			root: ".ui-search-input",
+			ui: <SearchInput value="" onChange={vi.fn()} {...ROOT_STYLING} />,
+		},
+		{
+			name: "Checkbox",
+			root: ".ui-checkbox",
+			ui: (
+				<Checkbox checked={false} onChange={vi.fn()} {...ROOT_STYLING}>
+					Styled
+				</Checkbox>
+			),
+		},
+		{
+			name: "Field",
+			root: ".ui-field",
+			ui: (
+				<Field {...ROOT_STYLING}>
+					<input />
+				</Field>
+			),
+		},
+		{
+			name: "SelectTrigger",
+			root: ".ui-select__trigger",
+			ui: (
+				<Select>
+					<SelectTrigger aria-label="Region" {...ROOT_STYLING}>
+						<SelectValue />
+					</SelectTrigger>
+					<SelectContent>
+						<SelectItem value="one">One</SelectItem>
+					</SelectContent>
+				</Select>
+			),
+		},
+	])("$name forwards className and style", ({ root, ui }) => {
+		const { container } = render(ui);
+		expect(qs(container, root)).toHaveClass(ROOT_STYLING.className);
+		expect(qs(container, root)).toHaveStyle(ROOT_STYLING.style);
+	});
+});
+
+describe("PasswordInput", () => {
+	it("reveals and re-masks the value, and disables the toggle with the input", () => {
+		const renderInput = (disabled?: boolean): React.JSX.Element => (
+			<PasswordInput
+				value="hunter2"
+				onChange={vi.fn()}
+				aria-label="API token"
+				disabled={disabled}
+			/>
+		);
+		const { rerender } = render(renderInput());
+		const input = screen.getByLabelText("API token");
+		expect(input).toHaveAttribute("type", "password");
+		fireEvent.click(screen.getByRole("button", { name: "Show value" }));
+		expect(input).toHaveAttribute("type", "text");
+		fireEvent.click(screen.getByRole("button", { name: "Hide value" }));
+		expect(input).toHaveAttribute("type", "password");
+
+		rerender(renderInput(true));
+		expect(screen.getByRole("button", { name: "Show value" })).toBeDisabled();
+	});
+});
+
+describe("SearchInput", () => {
+	it("clears through the same callback and returns focus after rerender", () => {
+		const onChange = vi.fn();
+		const ControlledSearch = (): React.JSX.Element => {
+			const [value, setValue] = useState("prod");
+			return (
+				<SearchInput
+					value={value}
+					onChange={(nextValue) => {
+						onChange(nextValue);
+						setValue(nextValue);
+					}}
+				/>
+			);
+		};
+		render(<ControlledSearch />);
+		fireEvent.click(screen.getByRole("button", { name: "Clear search" }));
+		expect(onChange).toHaveBeenCalledWith("");
+		expect(screen.getByRole("searchbox", { name: "Search" })).toHaveFocus();
+	});
+
+	it("exposes the input through a consumer ref alongside the internal one", () => {
+		const ref = createRef<HTMLInputElement>();
+		render(<SearchInput value="prod" onChange={vi.fn()} ref={ref} />);
+		expect(ref.current).toBe(screen.getByRole("searchbox", { name: "Search" }));
+
+		fireEvent.click(screen.getByRole("button", { name: "Clear search" }));
+		expect(screen.getByRole("searchbox", { name: "Search" })).toHaveFocus();
+	});
+});
+
+describe("Checkbox", () => {
+	it("reports toggles from the box and its label without owning the checked state", () => {
+		const onChange = vi.fn();
+		const renderCheckbox = (props: {
+			checked: boolean;
+			disabled?: boolean;
+		}) => (
+			<Checkbox onChange={onChange} {...props}>
+				Start on connect
+			</Checkbox>
+		);
+		const { rerender } = render(renderCheckbox({ checked: false }));
+		const checkbox = screen.getByRole("checkbox", { name: "Start on connect" });
+
+		fireEvent.click(checkbox);
+		expect(onChange).toHaveBeenCalledWith(true);
+		expect(checkbox).not.toBeChecked();
+
+		rerender(renderCheckbox({ checked: true }));
+		expect(checkbox).toBeChecked();
+		fireEvent.click(screen.getByText("Start on connect"));
+		expect(onChange).toHaveBeenCalledWith(false);
+
+		rerender(renderCheckbox({ checked: true, disabled: true }));
+		fireEvent.click(screen.getByText("Start on connect"));
+		expect(onChange).toHaveBeenCalledTimes(2);
+	});
+});
+
+describe("Field", () => {
+	it("labels the control and describes it with description and error text", () => {
+		const renderField = (error?: string): React.JSX.Element => (
+			<Field
+				label="Cores"
+				htmlFor="cores"
+				description="Choose between 1 and 16."
+				descriptionId="cores-description"
+				error={error}
+				errorId="cores-error"
+			>
+				<input id="cores" aria-describedby="cores-description cores-error" />
+			</Field>
+		);
+		const { rerender } = render(renderField("Out of range."));
+		const control = screen.getByRole("textbox", { name: "Cores" });
+		expect(control).toHaveAccessibleDescription(
+			"Choose between 1 and 16. Out of range.",
+		);
+
+		rerender(renderField());
+		expect(control).toHaveAccessibleDescription("Choose between 1 and 16.");
+	});
+});
+
+const RegionSelect = (
+	props: ComponentProps<typeof Select>,
+): React.JSX.Element => (
+	<Select {...props}>
+		<SelectTrigger aria-label="Region">
+			<SelectValue placeholder="Select a region" />
+		</SelectTrigger>
+		<SelectContent>
+			<SelectItem
+				value="us-pittsburgh"
+				description="Lowest latency"
+				aria-describedby="hint"
+			>
+				US East
+			</SelectItem>
+			<SelectItem value="eu-helsinki" disabled>
+				EU North
+			</SelectItem>
+			<SelectItem value="ap-sydney">Asia Pacific</SelectItem>
+		</SelectContent>
+	</Select>
+);
+
+describe("Select", () => {
+	it("opens with the keyboard, marks disabled options, and reports the selected value", () => {
+		const onValueChange = vi.fn();
+		const { rerender } = render(
+			<RegionSelect value="" onValueChange={onValueChange} />,
+		);
+		const trigger = screen.getByRole("combobox", { name: "Region" });
+		expect(trigger).toHaveTextContent("Select a region");
+
+		fireEvent.keyDown(trigger, { key: "Enter" });
+		expect(screen.getByRole("option", { name: "EU North" })).toHaveAttribute(
+			"aria-disabled",
+			"true",
+		);
+		fireEvent.keyDown(screen.getByRole("option", { name: "US East" }), {
+			key: "Enter",
+		});
+		expect(onValueChange).toHaveBeenCalledWith("us-pittsburgh");
+
+		rerender(<RegionSelect value="ap-sydney" onValueChange={onValueChange} />);
+		expect(trigger).toHaveTextContent("Asia Pacific");
+	});
+
+	it("describes options with their description text alongside consumer ids", () => {
+		render(
+			<>
+				<span id="hint">Available now.</span>
+				<RegionSelect defaultOpen />
+			</>,
+		);
+		expect(
+			screen.getByRole("option", { name: "US East" }),
+		).toHaveAccessibleDescription("Available now. Lowest latency");
+		expect(
+			screen.getByRole("option", { name: "Asia Pacific" }),
+		).not.toHaveAttribute("aria-describedby");
+	});
+});
diff --git a/test/webview/ui/tree.core.test.tsx b/test/webview/ui/tree.core.test.tsx
new file mode 100644
index 0000000000..4d371d8964
--- /dev/null
+++ b/test/webview/ui/tree.core.test.tsx
@@ -0,0 +1,202 @@
+import { act, fireEvent, render, screen } from "@testing-library/react";
+import { createRef } from "react";
+import { describe, expect, it } from "vitest";
+
+import { Tree, type TreeNode } from "@repo/ui";
+
+import {
+	BASIC_NODES,
+	activeGuides,
+	activeRow,
+	clickRow,
+	press,
+	renderTree,
+	row,
+	rowNames,
+	selectedRows,
+	tree,
+} from "./treeTestHelpers";
+
+/** The ARIA a flat row declares for itself, there being no groups. */
+const semantics = (name: string): Record<string, string | null> => {
+	const item = row(name);
+	return {
+		level: item.getAttribute("aria-level"),
+		posInSet: item.getAttribute("aria-posinset"),
+		setSize: item.getAttribute("aria-setsize"),
+		expanded: item.getAttribute("aria-expanded"),
+		tabIndex: item.getAttribute("tabindex"),
+	};
+};
+
+describe("Tree", () => {
+	it("forwards container props and declares flat row semantics", () => {
+		const ref = createRef<HTMLDivElement>();
+		renderTree({
+			"aria-label": "Explorer",
+			variant: "explorer",
+			className: "custom-tree",
+			style: { width: "240px" },
+			ref,
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+		});
+		const container = screen.getByRole("tree", { name: "Explorer" });
+		expect(container).toHaveClass(
+			"ui-tree",
+			"ui-tree--explorer",
+			"custom-tree",
+		);
+		expect(container).toHaveStyle({ width: "240px" });
+		expect(container).toHaveAttribute("tabindex", "0");
+		expect(ref.current).toBe(container);
+		expect(rowNames()).toEqual(["Parent", "Child", "Sibling", "Last"]);
+		expect(semantics("Parent")).toEqual({
+			level: "1",
+			posInSet: "1",
+			setSize: "2",
+			expanded: "true",
+			tabIndex: "-1",
+		});
+		expect(semantics("Sibling")).toEqual({
+			level: "2",
+			posInSet: "2",
+			setSize: "2",
+			expanded: null,
+			tabIndex: "-1",
+		});
+		expect(semantics("Last")).toEqual({
+			level: "1",
+			posInSet: "2",
+			setSize: "2",
+			expanded: null,
+			tabIndex: "-1",
+		});
+		expect(screen.queryByRole("group")).toBeNull();
+	});
+
+	it("keeps DOM focus on the container while the active row moves", () => {
+		renderTree({
+			"aria-label": "Files",
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+		});
+		act(() => tree().focus());
+		expect(activeRow()).toBe("Parent");
+		press("ArrowDown");
+		expect(activeRow()).toBe("Child");
+		expect(document.activeElement).toBe(tree());
+	});
+
+	it("keeps focus through a collapse, a reveal, and a removal", () => {
+		const withChild: readonly TreeNode[] = [
+			{ id: "top", label: "Top" },
+			{
+				id: "parent",
+				label: "Parent",
+				children: [{ id: "child", label: "Child" }],
+			},
+		];
+		const view = renderTree({
+			"aria-label": "Reveal",
+			nodes: withChild,
+			expandedIds: ["parent"],
+		});
+		clickRow("Child");
+		expect(activeRow()).toBe("Child");
+		view.update({ expandedIds: [] });
+		expect(activeRow()).toBeUndefined();
+		view.update({ expandedIds: ["parent"] });
+		expect(activeRow()).toBe("Child");
+		view.update({
+			nodes: [withChild[0], { id: "parent", label: "Parent", children: [] }],
+		});
+		expect(activeRow()).toBe("Parent");
+	});
+
+	it("draws indent guides for the selected row, and the focused one in focus", () => {
+		const nodes: readonly TreeNode[] = ["Alpha", "Beta"].map((branch) => ({
+			id: branch,
+			label: branch,
+			children: [{ id: `${branch} leaf`, label: `${branch} leaf` }],
+		}));
+		const view = renderTree({
+			"aria-label": "Guides",
+			nodes,
+			expandedIds: ["Alpha", "Beta"],
+		});
+		expect(activeGuides("Alpha leaf")).toEqual([false]);
+		clickRow("Beta leaf");
+		expect(activeGuides("Beta leaf")).toEqual([true]);
+		view.update({ selectedItemId: "Alpha leaf" });
+		expect(activeGuides("Alpha leaf")).toEqual([true]);
+		fireEvent.blur(row("Beta leaf"), { relatedTarget: document.body });
+		expect(activeGuides("Beta leaf")).toEqual([false]);
+		expect(activeGuides("Alpha leaf")).toEqual([true]);
+	});
+
+	it("activates only the guide of the branch a row belongs to", () => {
+		renderTree({
+			"aria-label": "Nested guides",
+			nodes: [
+				{
+					id: "root",
+					label: "Root",
+					children: [
+						{
+							id: "branch",
+							label: "Branch",
+							children: [{ id: "leaf", label: "Leaf" }],
+						},
+					],
+				},
+			],
+			expandedIds: ["root", "branch"],
+		});
+		clickRow("Branch");
+		expect(activeGuides("Leaf")).toEqual([false, true]);
+	});
+
+	it("follows controlled selection and keeps the focus mark while blurred", () => {
+		const view = renderTree({
+			"aria-label": "Selection",
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+			selectedItemId: "child",
+		});
+		expect(selectedRows()).toEqual(["Child"]);
+		view.update({ selectedItemId: "last" });
+		expect(selectedRows()).toEqual(["Last"]);
+		act(() => row("Child").focus());
+		expect(row("Child")).toHaveClass("ui-tree-item--focused");
+		fireEvent.blur(row("Child"), { relatedTarget: document.body });
+		expect(row("Child")).toHaveClass("ui-tree-item--focused");
+		expect(tree()).not.toHaveClass("ui-tree--focused");
+	});
+
+	it("scopes the focused styling to the tree the user is in", () => {
+		render(
+			<>
+				<Tree
+					aria-label="First"
+					selectedItemId="first"
+					nodes={[{ id: "first", label: "First item" }]}
+				/>
+				<Tree
+					aria-label="Second"
+					selectedItemId="second"
+					nodes={[{ id: "second", label: "Second item" }]}
+				/>
+			</>,
+		);
+		const first = screen.getByRole("tree", { name: "First" });
+		const second = screen.getByRole("tree", { name: "Second" });
+		fireEvent.focus(row("First item"));
+		expect(first).toHaveClass("ui-tree--focused");
+		expect(second).not.toHaveClass("ui-tree--focused");
+		fireEvent.blur(row("First item"), { relatedTarget: row("Second item") });
+		fireEvent.focus(row("Second item"));
+		expect(first).not.toHaveClass("ui-tree--focused");
+		expect(second).toHaveClass("ui-tree--focused");
+	});
+});
diff --git a/test/webview/ui/tree.hover.test.tsx b/test/webview/ui/tree.hover.test.tsx
new file mode 100644
index 0000000000..8916c400f8
--- /dev/null
+++ b/test/webview/ui/tree.hover.test.tsx
@@ -0,0 +1,111 @@
+import { act, fireEvent, render, screen } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import { Tree, TooltipProvider } from "@repo/ui";
+
+import { press, row, stubElementBoxes, tree } from "./treeTestHelpers";
+
+const DELAY_MS = 500;
+const label = (): Element =>
+	row("Alpha").getElementsByClassName("ui-tree-item__content")[0];
+
+const elapse = (): void => {
+	act(() => {
+		vi.advanceTimersByTime(DELAY_MS);
+	});
+};
+
+function renderHoverTree() {
+	return render(
+		<Tree
+			aria-label="Hover"
+			nodes={[
+				{
+					id: "a",
+					label: "Alpha",
+					action: (
+						<button
+							type="button"
+							onPointerDown={(event) => event.stopPropagation()}
+						>
+							Delete
+						</button>
+					),
+				},
+			]}
+		/>,
+		{
+			wrapper: ({ children }) => (
+				<TooltipProvider delayDuration={DELAY_MS}>{children}</TooltipProvider>
+			),
+		},
+	);
+}
+
+describe("Tree hover", () => {
+	beforeEach(() => {
+		vi.useFakeTimers();
+		stubElementBoxes();
+	});
+	afterEach(() => vi.useRealTimers());
+
+	describe.each(["pending", "shown"] as const)("%s hover", (state) => {
+		it.each([
+			["a tree press", () => fireEvent.pointerDown(tree())],
+			[
+				"an action press that stops propagation",
+				() => fireEvent.pointerDown(screen.getByRole("button")),
+			],
+			["a key press", () => press("ArrowDown")],
+			[
+				"focus leaving the tree",
+				() => fireEvent.focusOut(tree(), { relatedTarget: document.body }),
+			],
+		])("dismisses on %s without reopening", (_name, dismiss) => {
+			renderHoverTree();
+			act(() => tree().focus());
+			fireEvent.pointerEnter(label());
+			if (state === "shown") {
+				elapse();
+				expect(screen.getByRole("tooltip")).toHaveTextContent("Alpha");
+			}
+			dismiss();
+			expect(screen.queryByRole("tooltip")).toBeNull();
+			elapse();
+			expect(screen.queryByRole("tooltip")).toBeNull();
+		});
+	});
+
+	it.each([
+		["pointer leave", () => fireEvent.pointerLeave(label())],
+		["pointer press", () => fireEvent.pointerDown(tree())],
+	])("permits a fresh hover after %s", (_name, dismiss) => {
+		renderHoverTree();
+		fireEvent.pointerEnter(label());
+		dismiss();
+		elapse();
+		expect(screen.queryByRole("tooltip")).toBeNull();
+		fireEvent.pointerEnter(label());
+		expect(screen.queryByRole("tooltip")).toBeNull();
+		elapse();
+		expect(screen.getByRole("tooltip")).toHaveTextContent("Alpha");
+	});
+
+	it.each(["hidden", "removed"])(
+		"does not open for a target %s during the delay",
+		(state) => {
+			const view = renderHoverTree();
+			const target = label();
+			fireEvent.pointerEnter(target);
+			if (state === "hidden") {
+				vi.spyOn(target, "getBoundingClientRect").mockReturnValue(
+					new DOMRect(),
+				);
+			} else {
+				view.rerender(<Tree aria-label="Hover" nodes={[]} />);
+			}
+			elapse();
+			expect(screen.queryByRole("tooltip")).toBeNull();
+		},
+	);
+});
diff --git a/test/webview/ui/tree.keyboard.test.tsx b/test/webview/ui/tree.keyboard.test.tsx
new file mode 100644
index 0000000000..7ae897582f
--- /dev/null
+++ b/test/webview/ui/tree.keyboard.test.tsx
@@ -0,0 +1,261 @@
+import {
+	act,
+	fireEvent,
+	render,
+	screen,
+	waitFor,
+} from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import { Tree, TooltipProvider, type TreeNode, type TreeProps } from "@repo/ui";
+
+import {
+	BASIC_NODES,
+	activeRow,
+	clickRow,
+	expandedRows,
+	press,
+	renderStatefulTree,
+	renderTree,
+	row,
+	rowNames,
+	selectedRows,
+	stubElementBoxes,
+	tree,
+} from "./treeTestHelpers";
+
+/** Two branches and a leaf whose rich label holds a live control. */
+const NAV_NODES: readonly TreeNode[] = [
+	{
+		id: "alpha",
+		label: "Alpha",
+		children: [
+			{ id: "apricot", label: "Apricot" },
+			{ id: "amber", label: "Amber" },
+		],
+	},
+	{ id: "beta", label: "Beta", children: [{ id: "blue", label: "Blue" }] },
+	{
+		id: "bravo",
+		label: (
+			<>
+				<span>Bravo</span>
+				<button type="button">Action</button>
+			</>
+		),
+		textValue: "Bravo",
+	},
+];
+
+const navTree = (props: Partial<TreeProps> = {}) =>
+	renderStatefulTree({
+		"aria-label": "Navigation",
+		nodes: NAV_NODES,
+		expandedIds: ["alpha"],
+		...props,
+	});
+
+describe("Tree keyboard navigation", () => {
+	it("moves the active row with arrows, Home, and End", () => {
+		navTree();
+		for (const [key, active] of [
+			["ArrowDown", "Apricot"],
+			["ArrowDown", "Amber"],
+			["End", "Bravo"],
+			["Home", "Alpha"],
+			["ArrowUp", "Alpha"],
+		] as const) {
+			press(key);
+			expect(activeRow()).toBe(active);
+		}
+	});
+
+	it("expands, enters, leaves, and collapses a branch", () => {
+		navTree();
+		press("ArrowRight", { from: "Beta" });
+		expect(rowNames()).toContain("Blue");
+		press("ArrowRight", { from: "Beta" });
+		expect(activeRow()).toBe("Blue");
+		press("ArrowLeft");
+		expect(activeRow()).toBe("Beta");
+		press("ArrowLeft");
+		expect(rowNames()).not.toContain("Blue");
+	});
+
+	it("selects with Enter and toggles with Space", () => {
+		navTree({ expandedIds: [] });
+		press("Enter", { from: "Beta" });
+		expect(selectedRows()).toEqual(["Beta"]);
+		expect(expandedRows()).toEqual(["Beta"]);
+		press(" ", { from: "Alpha" });
+		expect(expandedRows()).toEqual(["Alpha", "Beta"]);
+		expect(selectedRows()).toEqual(["Beta"]);
+		// A leaf has nothing to toggle, so Space selects it.
+		press(" ", { from: "Bravo" });
+		expect(selectedRows()).toEqual(["Bravo"]);
+	});
+
+	it("only selects on Enter under doubleClick", () => {
+		navTree({ expandedIds: [], expandMode: "doubleClick" });
+		press("Enter", { from: "Beta" });
+		expect(selectedRows()).toEqual(["Beta"]);
+		expect(expandedRows()).toEqual([]);
+	});
+
+	it("clears selection, then the focus mark, before yielding Escape", () => {
+		renderStatefulTree({
+			"aria-label": "Escape",
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+			selectedItemId: "child",
+		});
+		clickRow("Child");
+		expect(press("Escape")).toBe(false);
+		expect(selectedRows()).toEqual([]);
+		expect(row("Child")).not.toHaveClass("ui-tree-item--focused");
+		// Nothing left to clear, so the host gets the key.
+		expect(press("Escape")).toBe(true);
+	});
+
+	it("lets the host claim keys first", () => {
+		const captured: string[] = [];
+		navTree({
+			onKeyDown: (event) => {
+				if (event.ctrlKey && event.key === "c") {
+					captured.push(event.key);
+					event.preventDefault();
+				}
+			},
+		});
+		clickRow("Alpha");
+		fireEvent.keyDown(tree(), { key: "c", ctrlKey: true });
+		expect(captured).toEqual(["c"]);
+		// The tree never saw the key: nothing moved, nothing changed.
+		expect(activeRow()).toBe("Alpha");
+		expect(selectedRows()).toEqual(["Alpha"]);
+	});
+
+	it("leaves a control's own keys alone and takes navigation back", () => {
+		navTree();
+		const action = screen.getByRole("button", { name: "Action" });
+		fireEvent.keyDown(action, { key: "Enter" });
+		expect(selectedRows()).toEqual([]);
+		fireEvent.keyDown(action, { key: "ArrowRight" });
+		expect(document.activeElement).toBe(row("Bravo"));
+	});
+
+	it("navigates the current order after the data reorders", () => {
+		const nodes = ["One", "Two"].map((label) => ({ id: label, label }));
+		const view = renderTree({ "aria-label": "Reorder", nodes });
+		press("ArrowDown");
+		expect(activeRow()).toBe("Two");
+		view.update({ nodes: [...nodes].reverse() });
+		press("ArrowDown");
+		expect(activeRow()).toBe("One");
+	});
+	it("moves by viewport pages, clamped at either end", () => {
+		render(
+			<div data-testid="scroller" style={{ overflowY: "auto" }}>
+				<Tree
+					aria-label="Paged"
+					nodes={Array.from({ length: 12 }, (_, index) => ({
+						id: `row-${index}`,
+						label: `Row ${index}`,
+					}))}
+				/>
+			</div>,
+		);
+		// jsdom lays nothing out, so a page is the scroller's height in rows.
+		Object.defineProperty(screen.getByTestId("scroller"), "clientHeight", {
+			value: 5 * 22,
+		});
+		for (const [key, active] of [
+			["PageDown", "Row 5"],
+			["PageDown", "Row 10"],
+			["PageDown", "Row 11"],
+			["PageUp", "Row 6"],
+		] as const) {
+			press(key);
+			expect(activeRow()).toBe(active);
+		}
+	});
+
+	it("opens the focused row's hover on the show-hover chord", async () => {
+		stubElementBoxes();
+		render(
+			<TooltipProvider delayDuration={0}>
+				<Tree
+					aria-label="Chord"
+					nodes={[
+						{ id: "alpha", label: "Alpha" },
+						{ id: "beta", label: "Beta" },
+					]}
+				/>
+			</TooltipProvider>,
+		);
+		act(() => tree().focus());
+		press("k", { ctrlKey: true });
+		expect(screen.queryByRole("tooltip")).toBeNull();
+		press("i", { ctrlKey: true });
+		expect(await screen.findByRole("tooltip")).toHaveTextContent("Alpha");
+		// Any other key puts it away again.
+		press("ArrowDown");
+		await waitFor(() => expect(screen.queryByRole("tooltip")).toBeNull());
+	});
+
+	describe("type-ahead", () => {
+		beforeEach(() => vi.useFakeTimers());
+		afterEach(() => vi.useRealTimers());
+
+		it("matches the labels the rows currently carry", () => {
+			const view = renderTree({
+				"aria-label": "Names",
+				nodes: [
+					{ id: "alpha", label: "Alpha" },
+					{ id: "cedar", label: "Amber" },
+				],
+			});
+			view.update({
+				nodes: [
+					{ id: "alpha", label: "Alpha" },
+					{ id: "cedar", label: "Cedar" },
+				],
+			});
+			press("c");
+			expect(activeRow()).toBe("Cedar");
+		});
+
+		it("walks the matches when the same key repeats", () => {
+			navTree();
+			for (const active of ["Beta", "Bravo", "Beta"]) {
+				press("b");
+				expect(activeRow()).toBe(active);
+			}
+		});
+
+		it("buffers keys into one query until it expires", () => {
+			navTree();
+			press("a");
+			expect(activeRow()).toBe("Apricot");
+			press("m");
+			expect(activeRow()).toBe("Amber");
+			void act(() => vi.advanceTimersByTime(800));
+			press("a");
+			expect(activeRow()).toBe("Alpha");
+		});
+
+		it("keeps a longer query on the row it already matched", () => {
+			renderTree({
+				"aria-label": "Prefixes",
+				nodes: [
+					{ id: "amber", label: "Amber" },
+					{ id: "amethyst", label: "Amethyst" },
+				],
+			});
+			press("a");
+			expect(activeRow()).toBe("Amethyst");
+			press("m");
+			expect(activeRow()).toBe("Amethyst");
+		});
+	});
+});
diff --git a/test/webview/ui/tree.rows.test.tsx b/test/webview/ui/tree.rows.test.tsx
new file mode 100644
index 0000000000..3b5c084648
--- /dev/null
+++ b/test/webview/ui/tree.rows.test.tsx
@@ -0,0 +1,241 @@
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+
+import { IconButton, Tree, TooltipProvider, type TreeNode } from "@repo/ui";
+
+import {
+	BASIC_NODES,
+	clickRow,
+	clickTwistie,
+	press,
+	renderStatefulTree,
+	renderTree,
+	row,
+	rowNames,
+	selectedRows,
+	stubElementBoxes,
+	tree,
+} from "./treeTestHelpers";
+
+/** Native hangs a row's hover off its label, so tests point at that. */
+const label = (name: string): Element =>
+	row(name).getElementsByClassName("ui-tree-item__content")[0];
+
+describe("Tree rows", () => {
+	it("renders icons, rich labels, class names, and an action slot", () => {
+		renderTree({
+			"aria-label": "Rows",
+			selectedItemId: "selected",
+			nodes: [
+				{ id: "plain", label: "Plain item", icon: "file" },
+				{ id: "rich", label: <em>Rich item</em>, textValue: "Rich item" },
+				{
+					id: "selected",
+					label: "Selected",
+					className: "custom-item",
+					action: <button type="button">Selected action</button>,
+				},
+			],
+		});
+		expect(
+			row("Plain item").querySelector(".ui-tree-item__content > .ui-icon"),
+		).toHaveClass("codicon-file");
+		expect(row("Rich item")).toContainHTML("<em>Rich item</em>");
+		expect(row("Selected")).toHaveClass("ui-tree-item", "custom-item");
+		expect(selectedRows()).toEqual(["Selected"]);
+		expect(
+			screen.getByRole("button", { name: "Selected action" }).parentElement,
+		).toHaveClass("ui-tree-item__action");
+	});
+
+	it("moves one hover between labels, defaulting to the text value", async () => {
+		stubElementBoxes();
+		render(
+			<TooltipProvider delayDuration={0}>
+				<Tree
+					aria-label="Hovers"
+					nodes={[
+						{ id: "a", label: "Plain item" },
+						{ id: "b", label: <em>Rich</em>, textValue: "Rich item" },
+						{ id: "c", label: "Custom", tooltip: "The whole story" },
+						{ id: "d", label: "Quiet", tooltip: null },
+					]}
+				/>
+			</TooltipProvider>,
+		);
+		const user = userEvent.setup();
+		for (const [name, text] of [
+			["Plain item", "Plain item"],
+			["Rich item", "Rich item"],
+			["Custom", "The whole story"],
+		]) {
+			await user.hover(label(name));
+			expect(await screen.findByRole("tooltip")).toHaveTextContent(text);
+			expect(screen.getAllByRole("tooltip")).toHaveLength(1);
+		}
+		await user.unhover(label("Custom"));
+		await waitFor(() => expect(screen.queryByRole("tooltip")).toBeNull());
+		await user.hover(label("Quiet"));
+		expect(screen.queryByRole("tooltip")).toBeNull();
+	});
+
+	it("waits for a new target but crosses an action bar at once", async () => {
+		stubElementBoxes();
+		render(
+			<TooltipProvider delayDuration={60}>
+				<Tree
+					aria-label="Handoff"
+					nodes={[
+						{
+							id: "row",
+							label: "Workspace",
+							action: (
+								<>
+									<IconButton icon="play" label="Start workspace" />
+									<IconButton icon="gear" label="Workspace settings" />
+								</>
+							),
+						},
+					]}
+				/>
+			</TooltipProvider>,
+		);
+		fireEvent.pointerEnter(label("Workspace"));
+		expect(await screen.findByRole("tooltip")).toHaveTextContent("Workspace");
+		// A different kind of target, so the bubble hides and waits again.
+		fireEvent.pointerEnter(
+			screen.getByRole("button", { name: "Start workspace" }),
+		);
+		expect(screen.queryByRole("tooltip")).toBeNull();
+		expect(await screen.findByRole("tooltip")).toHaveTextContent(
+			"Start workspace",
+		);
+		// One dense action bar is close enough to skip the delay.
+		fireEvent.pointerEnter(
+			screen.getByRole("button", { name: "Workspace settings" }),
+		);
+		expect(screen.getByRole("tooltip")).toHaveTextContent("Workspace settings");
+	});
+
+	it("treats an empty children array as a branch that has not loaded", () => {
+		const { emitted } = renderStatefulTree({
+			"aria-label": "Lazy",
+			nodes: [{ id: "lazy", label: "Lazy", children: [] }],
+			expandedIds: [],
+		});
+		expect(row("Lazy")).toHaveAttribute("aria-expanded", "false");
+		expect(
+			row("Lazy").querySelector(".ui-tree-item__chevron > .ui-icon"),
+		).toHaveClass("codicon-chevron-right");
+		press("ArrowRight", { from: "Lazy" });
+		expect(row("Lazy")).toHaveAttribute("aria-expanded", "true");
+		expect(emitted.expandedIds.at(-1)).toEqual(["lazy"]);
+	});
+
+	it("expands on a single click, and never from the twistie's selection", () => {
+		renderStatefulTree({
+			"aria-label": "Single click",
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+		});
+		clickRow("Parent");
+		expect(selectedRows()).toEqual(["Parent"]);
+		expect(rowNames()).toEqual(["Parent", "Last"]);
+		clickTwistie("Parent");
+		expect(rowNames()).toEqual(["Parent", "Child", "Sibling", "Last"]);
+		expect(selectedRows()).toEqual(["Parent"]);
+	});
+
+	it("waits for the second click under doubleClick", () => {
+		renderStatefulTree({
+			"aria-label": "Double click",
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+			expandMode: "doubleClick",
+		});
+		clickRow("Parent", { detail: 1 });
+		expect(selectedRows()).toEqual(["Parent"]);
+		expect(rowNames()).toContain("Child");
+		clickRow("Parent", { detail: 2 });
+		expect(rowNames()).not.toContain("Child");
+	});
+
+	it("expands every descendant branch on an Alt twistie click", () => {
+		renderStatefulTree({
+			"aria-label": "Recursive",
+			nodes: [
+				{
+					id: "root",
+					label: "Root",
+					children: [
+						{
+							id: "one",
+							label: "One",
+							children: [{ id: "deep", label: "Deep" }],
+						},
+						{ id: "two", label: "Two", children: [] },
+					],
+				},
+			],
+			expandedIds: ["one"],
+		});
+		clickTwistie("Root", { altKey: true });
+		expect(rowNames()).toEqual(["Root", "One", "Deep", "Two"]);
+	});
+
+	it("keeps a row action live and out of the row's way", async () => {
+		const onAction = vi.fn();
+		const { emitted } = renderStatefulTree({
+			"aria-label": "Actions",
+			nodes: [
+				{
+					...BASIC_NODES[0],
+					action: (
+						<button type="button" onClick={onAction}>
+							Delete
+						</button>
+					),
+				},
+			],
+			expandedIds: ["parent"],
+		});
+		const action = screen.getByRole("button", { name: "Delete" });
+		// Live before the row is ever touched, like a native action bar.
+		fireEvent.click(action);
+		expect(onAction).toHaveBeenCalledOnce();
+		expect(selectedRows()).toEqual([]);
+		expect(emitted.expandedIds).toEqual([]);
+		const user = userEvent.setup();
+		await user.tab();
+		expect(document.activeElement).toBe(tree());
+		await user.tab();
+		expect(document.activeElement).toBe(action);
+	});
+
+	it("leaves a click on anything focusable in a row to that element", () => {
+		const nodes: readonly TreeNode[] = [
+			{
+				id: "row",
+				textValue: "Row",
+				label: (
+					<>
+						<span data-testid="text">Row</span>
+						<a href="#anchor">Link</a>
+						<input aria-label="Field" />
+						<span role="button" tabIndex={0}>
+							Widget
+						</span>
+					</>
+				),
+			},
+		];
+		renderStatefulTree({ "aria-label": "Nested", nodes });
+		for (const name of ["link", "textbox", "button"] as const) {
+			fireEvent.click(screen.getByRole(name));
+		}
+		expect(selectedRows()).toEqual([]);
+		fireEvent.click(screen.getByTestId("text"));
+		expect(selectedRows()).toEqual(["Row"]);
+	});
+});
diff --git a/test/webview/ui/tree.selection.test.tsx b/test/webview/ui/tree.selection.test.tsx
new file mode 100644
index 0000000000..39800bfa55
--- /dev/null
+++ b/test/webview/ui/tree.selection.test.tsx
@@ -0,0 +1,209 @@
+import { act, fireEvent, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+import {
+	BASIC_NODES,
+	activeGuides,
+	activeRow,
+	clickRow,
+	clickTwistie,
+	press,
+	renderStatefulTree,
+	renderTree,
+	row,
+	selectedRows,
+	tree,
+} from "./treeTestHelpers";
+
+import type { TreeNode } from "@repo/ui";
+
+const MULTI_NODES: readonly TreeNode[] = ["One", "Two", "Three", "Four"].map(
+	(label) => ({ id: label.toLowerCase(), label }),
+);
+const multiTree = (selectedItemIds: readonly string[] = ["one"]) =>
+	renderStatefulTree({
+		"aria-label": "Multi",
+		multiSelect: true,
+		nodes: MULTI_NODES,
+		selectedItemIds,
+	});
+
+describe("Tree multi-select", () => {
+	it("toggles, replaces, and keeps the active row on the last one touched", () => {
+		const { emitted } = multiTree();
+		expect(tree()).toHaveAttribute("aria-multiselectable", "true");
+		expect(selectedRows()).toEqual(["One"]);
+		clickRow("Three", { ctrlKey: true });
+		expect(selectedRows()).toEqual(["One", "Three"]);
+		clickRow("One", { metaKey: true });
+		expect(selectedRows()).toEqual(["Three"]);
+		clickRow("Four");
+		expect(emitted.selectedItemIds.at(-1)).toEqual(["four"]);
+		expect(selectedRows()).toEqual(["Four"]);
+		clickRow("Two", { ctrlKey: true });
+		expect(activeRow()).toBe("Two");
+	});
+
+	it("extends and shrinks anchored ranges with clicks and arrows", () => {
+		multiTree();
+		clickRow("Two");
+		clickRow("Four", { shiftKey: true });
+		expect(selectedRows()).toEqual(["Two", "Three", "Four"]);
+		clickRow("Three", { shiftKey: true });
+		expect(selectedRows()).toEqual(["Two", "Three"]);
+		press("ArrowDown", { shiftKey: true });
+		expect(activeRow()).toBe("Four");
+		expect(selectedRows()).toEqual(["Two", "Three", "Four"]);
+		press("ArrowUp", { shiftKey: true });
+		expect(selectedRows()).toEqual(["Two", "Three"]);
+	});
+
+	it("starts a range from the controlled selection", () => {
+		multiTree();
+		clickRow("Three", { shiftKey: true });
+		expect(selectedRows()).toEqual(["One", "Two", "Three"]);
+	});
+
+	it("keeps the anchor when the controlled selection only reorders", () => {
+		const onSelectedItemsChange = vi.fn();
+		const view = renderTree({
+			"aria-label": "Ordered",
+			multiSelect: true,
+			nodes: MULTI_NODES,
+			selectedItemIds: ["one", "three"],
+			onSelectedItemsChange,
+		});
+		view.update({ selectedItemIds: ["three", "one"] });
+		clickRow("Four", { shiftKey: true });
+		expect(onSelectedItemsChange).toHaveBeenLastCalledWith([
+			"one",
+			"two",
+			"three",
+			"four",
+		]);
+	});
+
+	it("leaves Shift+Home and Shift+End as plain navigation", () => {
+		multiTree();
+		clickRow("Two");
+		press("End", { shiftKey: true });
+		expect(activeRow()).toBe("Four");
+		expect(selectedRows()).toEqual(["Two"]);
+		press("Home", { shiftKey: true });
+		expect(activeRow()).toBe("One");
+		expect(selectedRows()).toEqual(["Two"]);
+	});
+
+	it("uses the configured modifier for keyboard toggles", () => {
+		const onSelectedItemsChange = vi.fn();
+		renderTree({
+			"aria-label": "Alt selection",
+			multiSelect: true,
+			multiSelectModifier: "alt",
+			nodes: MULTI_NODES.slice(0, 2),
+			selectedItemIds: ["one"],
+			onSelectedItemsChange,
+		});
+		// Ctrl is not the modifier here, so Enter replaces the selection.
+		press("Enter", { from: "Two", ctrlKey: true, shiftKey: true });
+		expect(onSelectedItemsChange).toHaveBeenLastCalledWith(["two"]);
+		press("Enter", { from: "Two", altKey: true, shiftKey: true });
+		expect(onSelectedItemsChange).toHaveBeenLastCalledWith(["one", "two"]);
+	});
+
+	it("gives a selection modifier precedence over expansion", () => {
+		const { emitted } = renderStatefulTree({
+			"aria-label": "Modifier",
+			multiSelect: true,
+			selectedItemIds: [],
+			nodes: BASIC_NODES,
+			expandedIds: ["parent"],
+		});
+		clickRow("Parent", { ctrlKey: true });
+		clickRow("Parent", { shiftKey: true });
+		clickTwistie("Parent", { ctrlKey: true });
+		expect(emitted.expandedIds).toEqual([]);
+	});
+
+	it("scopes Ctrl+A to the sibling group before widening to the parent", () => {
+		const scoped = renderStatefulTree({
+			"aria-label": "Scoped",
+			multiSelect: true,
+			selectedItemIds: [],
+			expandedIds: ["parent"],
+			nodes: [
+				{
+					id: "parent",
+					label: "Parent",
+					children: [
+						{ id: "one", label: "One" },
+						{ id: "three", label: "Three" },
+					],
+				},
+				{ id: "outside", label: "Outside" },
+			],
+		});
+		act(() => row("One").focus());
+		press("a", { from: "One", ctrlKey: true });
+		expect(selectedRows()).toEqual(["One", "Three"]);
+		press("a", { from: "One", ctrlKey: true });
+		expect(selectedRows()).toEqual(["Parent", "One", "Three"]);
+		act(() => row("Parent").focus());
+		press("a", { from: "Parent", ctrlKey: true });
+		expect(selectedRows()).toEqual(["Parent", "One", "Three", "Outside"]);
+		scoped.unmount();
+		// Ctrl+Shift+A is not select-all, so the host keeps it.
+		multiTree();
+		expect(press("A", { from: "One", ctrlKey: true, shiftKey: true })).toBe(
+			true,
+		);
+		expect(selectedRows()).toEqual(["One"]);
+	});
+
+	it("clears a multi-selection and its focus mark with Escape", () => {
+		multiTree(["one", "two"]);
+		act(() => row("One").focus());
+		expect(press("Escape")).toBe(false);
+		expect(selectedRows()).toEqual([]);
+		expect(row("One")).toHaveClass("ui-tree-item--focused");
+		// The focus mark outlives the first Escape only past one selected row.
+		expect(press("Escape")).toBe(false);
+		expect(row("One")).not.toHaveClass("ui-tree-item--focused");
+		expect(press("Escape")).toBe(true);
+	});
+
+	it("lights a guide for every selected row", () => {
+		renderTree({
+			"aria-label": "Guides",
+			multiSelect: true,
+			selectedItemIds: ["a", "b"],
+			expandedIds: ["parent"],
+			nodes: [
+				{
+					id: "parent",
+					label: "Parent",
+					children: [
+						{ id: "a", label: "A" },
+						{ id: "b", label: "B" },
+					],
+				},
+			],
+		});
+		expect(activeGuides("A")).toEqual([true]);
+		expect(activeGuides("B")).toEqual([true]);
+	});
+
+	it("ignores selection modifiers without multiSelect", () => {
+		const { emitted } = renderStatefulTree({
+			"aria-label": "Single",
+			selectedItemId: "one",
+			nodes: MULTI_NODES.slice(0, 2),
+		});
+		expect(screen.getByRole("tree")).not.toHaveAttribute(
+			"aria-multiselectable",
+		);
+		fireEvent.click(row("Two"), { ctrlKey: true });
+		expect(emitted.selectedItemId.at(-1)).toBe("two");
+		expect(selectedRows()).toEqual(["Two"]);
+	});
+});
diff --git a/test/webview/ui/tree.sticky.test.tsx b/test/webview/ui/tree.sticky.test.tsx
new file mode 100644
index 0000000000..49aab8e0cc
--- /dev/null
+++ b/test/webview/ui/tree.sticky.test.tsx
@@ -0,0 +1,97 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+import { Tree } from "@repo/ui";
+
+import { BASIC_NODES } from "./treeTestHelpers";
+
+describe("Tree sticky scroll", () => {
+	it("renders an empty sticky anchor before scrolling", () => {
+		render(
+			<Tree
+				aria-label="Sticky"
+				stickyScroll
+				nodes={BASIC_NODES}
+				expandedIds={["parent"]}
+			/>,
+		);
+		expect(document.querySelector(".ui-tree-sticky")).not.toBeNull();
+		expect(document.querySelector(".ui-tree-sticky__rows")).toBeNull();
+	});
+	it("preserves pinned pointer, focus, and accessibility behavior", () => {
+		const onExpandedIdsChange = vi.fn();
+		const onSelectedItemChange = vi.fn();
+		render(
+			<div data-testid="scroller" style={{ overflowY: "auto" }}>
+				<Tree
+					aria-label="Sticky"
+					stickyScroll
+					nodes={[
+						{
+							id: "alpha",
+							label: "alpha",
+							children: [
+								{
+									id: "src",
+									label: "src",
+									children: Array.from({ length: 5 }, (_, index) => ({
+										id: `file-${index}`,
+										label: `file-${index}`,
+									})),
+								},
+							],
+						},
+					]}
+					expandedIds={["alpha", "src"]}
+					onExpandedIdsChange={onExpandedIdsChange}
+					onSelectedItemChange={onSelectedItemChange}
+				/>
+			</div>,
+		);
+		const scroller = screen.getByTestId("scroller");
+		Object.defineProperty(scroller, "clientHeight", { value: 10 * 22 });
+		const widget = document.querySelector<HTMLElement>(".ui-tree-sticky");
+		if (!widget?.parentElement) throw new Error("Expected the sticky widget.");
+		widget.getBoundingClientRect = () => ({ top: 0 }) as DOMRect;
+		widget.parentElement.getBoundingClientRect = () =>
+			({ top: -66 }) as DOMRect;
+		Object.assign(scroller, { scrollBy: vi.fn() });
+		fireEvent.scroll(scroller);
+		const pinned = [
+			...document.querySelectorAll(".ui-tree-sticky .ui-tree-item"),
+		];
+		expect(pinned.map((row) => row.textContent)).toEqual(["alpha", "src"]);
+		expect(document.querySelector(".ui-tree-sticky__shadow")).not.toBeNull();
+		expect(widget).not.toHaveAttribute("aria-hidden");
+		expect(widget).toHaveAttribute("tabindex", "0");
+		expect(pinned[0]).toHaveAttribute("role", "treeitem");
+		expect(pinned[0]).toHaveAccessibleName("alpha");
+		expect(pinned[0]).toHaveAttribute("aria-level", "1");
+		expect(pinned[0]).toHaveAttribute("aria-posinset", "1");
+		expect(pinned[0]).toHaveAttribute("aria-setsize", "1");
+		expect(pinned[0]).toHaveAttribute("aria-selected", "false");
+		expect(pinned[1]).toHaveAttribute("aria-expanded", "true");
+		const twistie = pinned[1]?.querySelector(".ui-tree-item__chevron");
+		expect(twistie).not.toBeNull();
+		fireEvent.click(twistie!);
+		expect(onExpandedIdsChange).toHaveBeenCalledWith(["alpha"]);
+		expect(onSelectedItemChange).toHaveBeenCalledOnce();
+		expect(onSelectedItemChange).toHaveBeenCalledWith("src");
+		onSelectedItemChange.mockClear();
+		fireEvent.click(pinned[0]);
+		expect(onSelectedItemChange).toHaveBeenCalledOnce();
+		expect(onSelectedItemChange).toHaveBeenCalledWith("alpha");
+		expect(onExpandedIdsChange).toHaveBeenCalledOnce();
+		const realAlpha = document.querySelector<HTMLElement>(
+			'[data-tree-id="alpha"]',
+		);
+		expect(screen.getByRole("tree")).toHaveAttribute(
+			"aria-activedescendant",
+			realAlpha?.id,
+		);
+		expect(document.activeElement).toBe(screen.getByRole("tree"));
+		vi.mocked(scroller.scrollBy).mockClear();
+		fireEvent.click(pinned[0], { ctrlKey: true });
+		expect(scroller.scrollBy).toHaveBeenCalledOnce();
+	});
+});
diff --git a/test/webview/ui/treeController.test.tsx b/test/webview/ui/treeController.test.tsx
new file mode 100644
index 0000000000..cd6f439283
--- /dev/null
+++ b/test/webview/ui/treeController.test.tsx
@@ -0,0 +1,49 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { useRef, useState } from "react";
+import { describe, expect, it } from "vitest";
+
+import { useTreeAdapter } from "@repo/ui/components/Tree/useTreeAdapter";
+
+function ControlledTreeController(): React.JSX.Element {
+	const [selectedItemIds, setSelectedItemIds] = useState<readonly string[]>([
+		"one",
+	]);
+	const treeRef = useRef<HTMLDivElement>(null);
+	const adapter = useTreeAdapter({
+		nodes: [
+			{ id: "one", label: "One" },
+			{ id: "two", label: "Two" },
+			{ id: "three", label: "Three" },
+		],
+		expandedIds: [],
+		expandMode: "singleClick",
+		multiSelect: true,
+		multiSelectModifier: "ctrlCmd",
+		selectedItemIds,
+		onSelectedItemsChange: setSelectedItemIds,
+		treeRef,
+	});
+
+	return (
+		<div ref={treeRef} role="tree" tabIndex={0} onKeyDown={adapter.onKeyDown}>
+			<output data-testid="tab-stop">{adapter.tabStopId}</output>
+			<output data-testid="selection">{selectedItemIds.join(",")}</output>
+			{adapter.model.visibleRows.map((row) => (
+				<div key={row.node.id} data-tree-id={row.node.id} />
+			))}
+		</div>
+	);
+}
+
+describe("useTreeAdapter", () => {
+	it("keeps the Shift+Arrow target as the tab target after the selection echo", () => {
+		render(<ControlledTreeController />);
+		const one = document.querySelector<HTMLElement>('[data-tree-id="one"]');
+		if (!one) throw new Error("Expected the first row.");
+
+		fireEvent.keyDown(one, { key: "ArrowDown", shiftKey: true });
+
+		expect(screen.getByTestId("selection")).toHaveTextContent("one,two");
+		expect(screen.getByTestId("tab-stop")).toHaveTextContent("two");
+	});
+});
diff --git a/test/webview/ui/treeModel.test.tsx b/test/webview/ui/treeModel.test.tsx
new file mode 100644
index 0000000000..08e6030f95
--- /dev/null
+++ b/test/webview/ui/treeModel.test.tsx
@@ -0,0 +1,114 @@
+import { describe, expect, it } from "vitest";
+
+import {
+	createTreeModel,
+	parentId,
+	type TreeNode,
+	type TreeRowModel,
+} from "@repo/ui/components/Tree/treeModel";
+
+const NODES: readonly TreeNode[] = [
+	{
+		id: "src",
+		label: "src",
+		children: [
+			{ id: "tree", label: <em>Tree.tsx</em>, textValue: "Tree.tsx" },
+			{
+				id: "tests",
+				label: "tests",
+				children: [{ id: "unit", label: "unit" }],
+			},
+		],
+	},
+	{ id: "readme", label: "README.md" },
+];
+
+const model = (...expandedIds: string[]) =>
+	createTreeModel(NODES, new Set(expandedIds));
+const ids = (rows: readonly TreeRowModel[]): string[] =>
+	rows.map((row) => row.node.id);
+const rowOf = (id: string): TreeRowModel => {
+	const row = model("src", "tests").rowsById.get(id);
+	if (!row) throw new Error(`Expected row ${id}.`);
+	return row;
+};
+
+describe("createTreeModel", () => {
+	it.each([
+		[[], ["src", "readme"]],
+		[["src"], ["src", "tree", "tests", "readme"]],
+		[
+			["src", "tests"],
+			["src", "tree", "tests", "unit", "readme"],
+		],
+	] as const)(
+		"projects expanded subtrees %j in tree order",
+		(expanded, rows) => {
+			expect(ids(model(...expanded).visibleRows)).toEqual(rows);
+		},
+	);
+
+	it("keeps hidden rows addressable while only visible ones are projected", () => {
+		const collapsed = model();
+		expect(ids(collapsed.rows)).toEqual([
+			"src",
+			"tree",
+			"tests",
+			"unit",
+			"readme",
+		]);
+		expect([...collapsed.visibleIds]).toEqual(["src", "readme"]);
+		expect(collapsed.rowsById.get("unit")?.textValue).toBe("unit");
+	});
+
+	it("derives row metadata from hierarchy, labels, and expansion", () => {
+		expect(rowOf("src")).toMatchObject({
+			pathIds: [],
+			posInSet: 1,
+			setSize: 2,
+			textValue: "src",
+			expanded: true,
+		});
+		expect(rowOf("unit")).toMatchObject({
+			pathIds: ["src", "tests"],
+			posInSet: 1,
+			setSize: 1,
+			expanded: undefined,
+		});
+		expect(rowOf("readme")).toMatchObject({ posInSet: 2, setSize: 2 });
+		// A rich label carries its own text value.
+		expect(rowOf("tree").textValue).toBe("Tree.tsx");
+		expect(parentId(rowOf("unit"))).toBe("tests");
+		expect(parentId(rowOf("src"))).toBeUndefined();
+	});
+
+	it.each([
+		[
+			"siblings",
+			[
+				{ id: "dup", label: "One" },
+				{ id: "dup", label: "Two" },
+			],
+		],
+		[
+			"a collapsed branch",
+			[
+				{
+					id: "collapsed",
+					label: "Collapsed",
+					children: [
+						{ id: "dup", label: "One" },
+						{ id: "dup", label: "Two" },
+					],
+				},
+			],
+		],
+	] satisfies ReadonlyArray<readonly [string, readonly TreeNode[]]>)(
+		"rejects an id reused by %s",
+		(_case, nodes) => {
+			expect(() => createTreeModel(nodes, new Set())).toThrow(
+				/must be unique/i,
+			);
+		},
+	);
+});
diff --git a/test/webview/ui/treePolicy.test.ts b/test/webview/ui/treePolicy.test.ts
new file mode 100644
index 0000000000..19705f3655
--- /dev/null
+++ b/test/webview/ui/treePolicy.test.ts
@@ -0,0 +1,315 @@
+import { describe, expect, it } from "vitest";
+
+import {
+	createTreeModel,
+	type TreeModel,
+	type TreeNode,
+	type TreeRowModel,
+} from "@repo/ui/components/Tree/treeModel";
+import {
+	keyboardCommands,
+	pointerCommands,
+	type KeyboardCommandInput,
+	type PointerCommandInput,
+	type TreeModifiers,
+} from "@repo/ui/components/Tree/treePolicy";
+
+const NODES: readonly TreeNode[] = [
+	{
+		id: "parent",
+		label: "Parent",
+		children: [{ id: "child", label: "Child" }],
+	},
+	{ id: "last", label: "Last" },
+];
+const model = createTreeModel(NODES, new Set(["parent"]));
+const collapsedModel = createTreeModel(NODES, new Set());
+const row = (id: string, from: TreeModel = model): TreeRowModel => {
+	const found = from.rowsById.get(id);
+	if (!found) throw new Error(`Expected row ${id}.`);
+	return found;
+};
+
+const NO_MODIFIERS: TreeModifiers = {
+	ctrlKey: false,
+	metaKey: false,
+	altKey: false,
+	shiftKey: false,
+};
+/** The modifiers a gesture holds down, by name. */
+const held = (...pressed: Array<keyof TreeModifiers>): TreeModifiers => ({
+	...NO_MODIFIERS,
+	...Object.fromEntries(pressed.map((key) => [key, true])),
+});
+
+const pointer = (overrides: Partial<PointerCommandInput> = {}) =>
+	pointerCommands({
+		expandMode: "singleClick",
+		multiSelect: false,
+		multiSelectModifier: "ctrlCmd",
+		row: row("parent"),
+		source: "row",
+		onTwistie: false,
+		detail: 1,
+		modifiers: NO_MODIFIERS,
+		...overrides,
+	});
+const keyboard = (overrides: Partial<KeyboardCommandInput> = {}) =>
+	keyboardCommands({
+		expandMode: "singleClick",
+		multiSelect: false,
+		multiSelectModifier: "ctrlCmd",
+		key: "ArrowDown",
+		row: row("parent"),
+		visibleRows: model.visibleRows,
+		fromAction: false,
+		selectedCount: 0,
+		hasFocusedRow: false,
+		modifiers: NO_MODIFIERS,
+		...overrides,
+	});
+
+const FOCUS_PARENT = { type: "focus", id: "parent" };
+const TOGGLE_PARENT = { type: "toggle", id: "parent", recursive: false };
+/** Selects replace the selection and keep hidden rows unless told otherwise. */
+const select = (
+	id: string,
+	options: { toggle?: boolean; range?: boolean; preserveHidden?: boolean } = {},
+) => ({
+	type: "select",
+	id,
+	toggle: false,
+	range: false,
+	preserveHidden: true,
+	...options,
+});
+
+describe("pointerCommands", () => {
+	it("focuses and selects before expanding, so a click cannot reorder them", () => {
+		expect(pointer()).toEqual([
+			{ type: "focus", id: "parent" },
+			{
+				type: "select",
+				id: "parent",
+				toggle: false,
+				range: false,
+				preserveHidden: true,
+			},
+			{ type: "toggle", id: "parent", recursive: false },
+		]);
+	});
+
+	it("keeps a twistie click off the selection, and Alt recursive", () => {
+		expect(
+			pointer({ onTwistie: true, detail: 2, modifiers: held("altKey") }),
+		).toEqual([
+			FOCUS_PARENT,
+			{ type: "toggle", id: "parent", recursive: true },
+		]);
+	});
+
+	it("leaves Alt to selection when it is the selection modifier", () => {
+		expect(
+			pointer({
+				onTwistie: true,
+				multiSelect: true,
+				multiSelectModifier: "alt",
+				modifiers: held("altKey"),
+			}),
+		).toEqual([
+			FOCUS_PARENT,
+			select("parent", { toggle: true, preserveHidden: false }),
+		]);
+	});
+
+	it.each([
+		[1, [FOCUS_PARENT, select("parent")]],
+		[2, [FOCUS_PARENT, select("parent"), TOGGLE_PARENT]],
+	])("expands on click %i under doubleClick", (detail, commands) => {
+		expect(pointer({ expandMode: "doubleClick", detail })).toEqual(commands);
+	});
+
+	it("leaves a leaf nothing to expand", () => {
+		expect(pointer({ row: row("last") })).toEqual([
+			{ type: "focus", id: "last" },
+			select("last"),
+		]);
+	});
+
+	it("gives a selection gesture precedence over twistie expansion", () => {
+		expect(
+			pointer({
+				multiSelect: true,
+				onTwistie: true,
+				modifiers: held("ctrlKey", "shiftKey"),
+			}),
+		).toEqual([
+			FOCUS_PARENT,
+			select("parent", { toggle: true, range: true, preserveHidden: false }),
+		]);
+	});
+
+	it("selects from a pinned row without expanding it, twistie aside", () => {
+		expect(pointer({ source: "sticky" })).toEqual([
+			FOCUS_PARENT,
+			select("parent"),
+		]);
+		expect(pointer({ source: "sticky", onTwistie: true })).toEqual([
+			FOCUS_PARENT,
+			select("parent"),
+			TOGGLE_PARENT,
+		]);
+		// A selection gesture on a pinned row never moves focus to it.
+		expect(
+			pointer({
+				source: "sticky",
+				multiSelect: true,
+				modifiers: held("shiftKey"),
+			}),
+		).toEqual([select("parent", { range: true, preserveHidden: false })]);
+	});
+});
+
+describe("keyboardCommands", () => {
+	it.each([
+		["ArrowDown", 1, false],
+		["ArrowUp", -1, false],
+		["PageDown", 1, true],
+		["PageUp", -1, true],
+	] as const)("moves the active row on %s", (key, offset, page) => {
+		expect(keyboard({ key })).toEqual({
+			commands: [{ type: "move", id: "parent", offset, page, extend: false }],
+			preventDefault: true,
+			focusRowElementId: undefined,
+		});
+	});
+
+	it("extends the selection with Shift, but never by the page", () => {
+		expect(
+			keyboard({ multiSelect: true, modifiers: held("shiftKey") }).commands,
+		).toEqual([
+			{ type: "move", id: "parent", offset: 1, page: false, extend: true },
+		]);
+		expect(
+			keyboard({
+				key: "PageDown",
+				multiSelect: true,
+				modifiers: held("shiftKey"),
+			}).commands,
+		).toEqual([
+			{ type: "move", id: "parent", offset: 1, page: true, extend: false },
+		]);
+		// Shift alone extends nothing without multi-selection.
+		expect(keyboard({ modifiers: held("shiftKey") }).commands).toEqual([
+			{ type: "move", id: "parent", offset: 1, page: false, extend: false },
+		]);
+	});
+
+	it.each([
+		["Home", "parent"],
+		["End", "last"],
+	])("jumps to the %s row", (key, id) => {
+		expect(keyboard({ key }).commands).toEqual([{ type: "focus", id }]);
+	});
+
+	it("walks into and out of branches", () => {
+		expect(keyboard({ key: "ArrowRight" }).commands).toEqual([
+			{ type: "focus", id: "child" },
+		]);
+		expect(keyboard({ key: "ArrowLeft", row: row("child") }).commands).toEqual([
+			FOCUS_PARENT,
+		]);
+		expect(keyboard({ key: "ArrowLeft" }).commands).toEqual([TOGGLE_PARENT]);
+		expect(
+			keyboard({
+				key: "ArrowRight",
+				row: row("parent", collapsedModel),
+				visibleRows: collapsedModel.visibleRows,
+			}).commands,
+		).toEqual([TOGGLE_PARENT]);
+	});
+
+	it("keeps selection and expansion apart on Enter and Space", () => {
+		expect(keyboard({ key: "Enter" }).commands).toEqual([
+			select("parent"),
+			TOGGLE_PARENT,
+		]);
+		expect(
+			keyboard({ key: "Enter", expandMode: "doubleClick" }).commands,
+		).toEqual([select("parent")]);
+		expect(keyboard({ key: " " }).commands).toEqual([TOGGLE_PARENT]);
+		expect(keyboard({ key: " ", row: row("child") }).commands).toEqual([
+			select("child"),
+		]);
+	});
+
+	it("adds to the selection with the selection modifier held", () => {
+		expect(
+			keyboard({
+				key: "Enter",
+				multiSelect: true,
+				modifiers: held("ctrlKey", "shiftKey"),
+			}).commands,
+		).toEqual([select("parent", { toggle: true })]);
+		expect(
+			keyboard({
+				key: " ",
+				row: row("child"),
+				multiSelect: true,
+				modifiers: held("metaKey"),
+			}).commands,
+		).toEqual([select("child", { toggle: true })]);
+		expect(
+			keyboard({ key: "a", multiSelect: true, modifiers: held("ctrlKey") })
+				.commands,
+		).toEqual([{ type: "selectScope", id: "parent" }]);
+	});
+
+	it.each([
+		[0, false, false, false],
+		[1, false, true, false],
+		[1, true, true, true],
+	])(
+		"dismisses %i selected rows with focus %s",
+		(selectedCount, hasFocusedRow, clearSelection, clearFocus) => {
+			expect(
+				keyboard({ key: "Escape", selectedCount, hasFocusedRow }),
+			).toMatchObject({
+				commands: [{ type: "dismiss", clearSelection, clearFocus }],
+				preventDefault: clearSelection || hasFocusedRow,
+			});
+		},
+	);
+
+	it("types ahead on a bare printable key, and leaves the rest to the host", () => {
+		expect(keyboard({ key: "B" })).toMatchObject({
+			commands: [{ type: "typeahead", id: "parent", key: "b" }],
+			preventDefault: true,
+		});
+		expect(keyboard({ key: "b", modifiers: held("ctrlKey") })).toEqual({
+			commands: [],
+			preventDefault: false,
+			focusRowElementId: undefined,
+		});
+		expect(keyboard({ key: "Tab" })).toEqual({
+			commands: [],
+			preventDefault: false,
+			focusRowElementId: undefined,
+		});
+	});
+
+	it("gives a row action its own keys and takes the navigating ones back", () => {
+		expect(keyboard({ key: "Enter", fromAction: true })).toEqual({
+			commands: [],
+			preventDefault: false,
+			focusRowElementId: undefined,
+		});
+		expect(keyboard({ key: "ArrowDown", fromAction: true })).toMatchObject({
+			commands: [
+				{ type: "move", id: "parent", offset: 1, page: false, extend: false },
+			],
+			preventDefault: true,
+			focusRowElementId: "parent",
+		});
+	});
+});
diff --git a/test/webview/ui/treeStickyState.test.ts b/test/webview/ui/treeStickyState.test.ts
new file mode 100644
index 0000000000..b14e470a08
--- /dev/null
+++ b/test/webview/ui/treeStickyState.test.ts
@@ -0,0 +1,58 @@
+import { describe, expect, it } from "vitest";
+
+import { computeStickyState } from "@repo/ui/components/Tree/sticky/stickyState";
+import {
+	createTreeModel,
+	ROW_HEIGHT_PX,
+	type TreeNode,
+} from "@repo/ui/components/Tree/treeModel";
+const leaves = (prefix: string, count: number): TreeNode[] =>
+	Array.from({ length: count }, (_, index) => ({
+		id: `${prefix}/${index}`,
+		label: `${prefix}/${index}`,
+	}));
+// Row indices: 0 a, 1-3 a/*, 4 b, 5-7 b/*, 8 c, 9-13 c/*, 14 z.
+const ROWS = createTreeModel(
+	[
+		{
+			id: "a",
+			label: "a",
+			children: [
+				...leaves("a", 3),
+				{
+					id: "b",
+					label: "b",
+					children: [
+						...leaves("b", 3),
+						{ id: "c", label: "c", children: leaves("c", 5) },
+					],
+				},
+			],
+		},
+		{ id: "z", label: "z" },
+	],
+	new Set(["a", "b", "c"]),
+).visibleRows;
+const px = (rows: number): number => rows * ROW_HEIGHT_PX;
+const VIEWPORT = px(10);
+describe("computeStickyState", () => {
+	it.each([
+		["before scrolling", 0, VIEWPORT, 7, []],
+		["without a viewport", px(2), 0, 7, []],
+		["in the first subtree", px(1), VIEWPORT, 7, ["a"]],
+		["at the deepest subtree", px(9), VIEWPORT, 7, ["a", "b", "c"]],
+		["at the item cap", px(9), VIEWPORT, 2, ["a", "b"]],
+		["at 40% of the viewport", px(9), px(1.5) / 0.4, 7, ["a"]],
+		["past every branch", px(14), VIEWPORT, 7, []],
+	] as const)(
+		"pins the expected chain %s",
+		(_case, scrollTop, height, cap, ids) => {
+			expect(computeStickyState(ROWS, scrollTop, height, cap).ids).toEqual(ids);
+		},
+	);
+	it("pushes the widget out as the last pinned subtree ends", () => {
+		const state = computeStickyState(ROWS, px(12), VIEWPORT, 7);
+		expect(state.ids).toEqual(["a", "b", "c"]);
+		expect(state.pushOffset).toBe(px(14) - (px(12) + px(3)));
+	});
+});
diff --git a/test/webview/ui/treeTestHelpers.tsx b/test/webview/ui/treeTestHelpers.tsx
new file mode 100644
index 0000000000..24404834c2
--- /dev/null
+++ b/test/webview/ui/treeTestHelpers.tsx
@@ -0,0 +1,169 @@
+import { fireEvent, render, screen } from "@testing-library/react";
+import { useState } from "react";
+import { onTestFinished, vi } from "vitest";
+
+import { Tree, type TreeNode, type TreeProps } from "@repo/ui";
+
+/**
+ * Tree props as a test writes them. `TreeProps` is a union over the selection
+ * APIs, and a spread does not keep track of which side it is on, so the harness
+ * re-asserts it at the one point it renders.
+ */
+export type TreeTestProps = Partial<TreeProps> & {
+	readonly nodes: readonly TreeNode[];
+};
+const asTreeProps = (props: object): TreeProps => props as TreeProps;
+
+/** A branch of two plus a leaf: depth, sibling order, and hideable rows. */
+export const BASIC_NODES: readonly TreeNode[] = [
+	{
+		id: "parent",
+		label: "Parent",
+		children: [
+			{ id: "child", label: "Child" },
+			{ id: "sibling", label: "Sibling" },
+		],
+	},
+	{ id: "last", label: "Last" },
+];
+
+/** jsdom has no layout; supply visible boxes for this test only. */
+export function stubElementBoxes(): void {
+	const spy = vi
+		.spyOn(Element.prototype, "getBoundingClientRect")
+		.mockImplementation(() => DOMRect.fromRect({ width: 200, height: 22 }));
+	onTestFinished(() => spy.mockRestore());
+}
+
+export const tree = (): HTMLElement => screen.getByRole("tree");
+
+export const row = (name: string): HTMLElement =>
+	screen.getByRole("treeitem", { name });
+
+const nameOf = (item: Element | null): string =>
+	item?.getAttribute("aria-label") ?? "";
+
+/** The visible rows, by name, in render order. */
+export const rowNames = (): string[] =>
+	screen.getAllByRole("treeitem").map(nameOf);
+
+/** The row `aria-activedescendant` points at, which is the focused row. */
+export const activeRow = (): string | undefined => {
+	const id = tree().getAttribute("aria-activedescendant");
+	const focused = id ? document.getElementById(id) : null;
+	return focused ? nameOf(focused) : undefined;
+};
+
+export const selectedRows = (): string[] =>
+	screen
+		.getAllByRole("treeitem")
+		.filter((item) => item.getAttribute("aria-selected") === "true")
+		.map(nameOf);
+
+/** The branch rows currently open, by name. */
+export const expandedRows = (): string[] =>
+	screen
+		.getAllByRole("treeitem")
+		.filter((item) => item.getAttribute("aria-expanded") === "true")
+		.map(nameOf);
+
+/**
+ * Sends a key to the container, where DOM focus lives; `from` targets a row, as
+ * a click leaves it. Returns false when the tree claimed the key.
+ */
+export const press = (
+	key: string,
+	{ from, ...init }: { from?: string } & KeyboardEventInit = {},
+): boolean => fireEvent.keyDown(from ? row(from) : tree(), { key, ...init });
+
+export const clickRow = (name: string, init?: MouseEventInit): void => {
+	fireEvent.click(row(name), init);
+};
+
+/** Clicks a branch's twistie rather than its body. */
+export const clickTwistie = (name: string, init?: MouseEventInit): void => {
+	const chevron = row(name).querySelector(".ui-tree-item__chevron");
+	if (!chevron) {
+		throw new Error(`Expected a twistie on ${name}.`);
+	}
+	fireEvent.click(chevron, init);
+};
+
+/** A row's indent guides, outermost first: true where one is drawn active. */
+export const activeGuides = (name: string): boolean[] =>
+	[...row(name).querySelectorAll(".ui-tree-item__indent-slot")].map((slot) =>
+		slot.classList.contains("ui-tree-item__indent-slot--active"),
+	);
+
+/** A fully controlled Tree, for tests that drive the props themselves. */
+export function renderTree(props: TreeTestProps) {
+	const view = render(<Tree {...asTreeProps(props)} />);
+	return {
+		...view,
+		/** Re-renders with props changed, as a consumer's state would. */
+		update: (next: Partial<TreeTestProps>): void =>
+			view.rerender(<Tree {...asTreeProps({ ...props, ...next })} />),
+	};
+}
+
+interface Recorder {
+	readonly selectedItemId: Array<string | undefined>;
+	readonly selectedItemIds: Array<readonly string[]>;
+	readonly expandedIds: Array<readonly string[]>;
+}
+
+function StatefulTree({
+	props,
+	record,
+}: {
+	props: TreeTestProps;
+	record: Recorder;
+}): React.JSX.Element {
+	const [selectedId, setSelectedId] = useState(props.selectedItemId);
+	const [selectedIds, setSelectedIds] = useState(props.selectedItemIds ?? []);
+	const [expandedIds, setExpandedIds] = useState(props.expandedIds);
+	const selection = props.multiSelect
+		? {
+				multiSelect: true,
+				selectedItemIds: selectedIds,
+				onSelectedItemsChange: (ids: readonly string[]) => {
+					record.selectedItemIds.push(ids);
+					setSelectedIds(ids);
+				},
+			}
+		: {
+				multiSelect: false,
+				selectedItemId: selectedId,
+				onSelectedItemChange: (id: string | undefined) => {
+					record.selectedItemId.push(id);
+					setSelectedId(id);
+				},
+			};
+	return (
+		<Tree
+			{...asTreeProps({
+				...props,
+				...selection,
+				expandedIds,
+				onExpandedIdsChange: (ids: readonly string[]) => {
+					record.expandedIds.push(ids);
+					setExpandedIds(ids);
+				},
+			})}
+		/>
+	);
+}
+
+/**
+ * A Tree that keeps its own state, so a gesture's result lands in the DOM.
+ * `emitted` records what it reported to its consumer, newest last.
+ */
+export function renderStatefulTree(props: TreeTestProps) {
+	const emitted: Recorder = {
+		selectedItemId: [],
+		selectedItemIds: [],
+		expandedIds: [],
+	};
+	const view = render(<StatefulTree props={props} record={emitted} />);
+	return { ...view, emitted };
+}
diff --git a/test/webview/ui/treeTransition.test.ts b/test/webview/ui/treeTransition.test.ts
new file mode 100644
index 0000000000..259fbdb1a9
--- /dev/null
+++ b/test/webview/ui/treeTransition.test.ts
@@ -0,0 +1,335 @@
+import { describe, expect, it } from "vitest";
+
+import {
+	createTreeModel,
+	type TreeModel,
+	type TreeNode,
+	type TreeRowModel,
+} from "@repo/ui/components/Tree/treeModel";
+import {
+	deriveTreeInteractionView,
+	initialTreeInteractionState,
+	rowFocused,
+	transitionTree,
+	type TreeInteractionState,
+} from "@repo/ui/components/Tree/treeTransition";
+
+const NODES: readonly TreeNode[] = [
+	{
+		id: "parent",
+		label: "Parent",
+		children: [{ id: "child", label: "Child" }],
+	},
+	{ id: "last", label: "Last" },
+];
+const OPEN = createTreeModel(NODES, new Set(["parent"]));
+const CLOSED = createTreeModel(NODES, new Set());
+
+const rowOf = (model: TreeModel, id: string): TreeRowModel => {
+	const row = model.rowsById.get(id);
+	if (!row) throw new Error(`Expected row ${id}.`);
+	return row;
+};
+
+/** Focuses a row the way a click does, through the view's own selection key. */
+function focusRow(
+	id: string,
+	model: TreeModel,
+	controlledIds: readonly string[] = [],
+): TreeInteractionState {
+	const state = initialTreeInteractionState(controlledIds);
+	const { controlledKey } = deriveTreeInteractionView(
+		state,
+		model,
+		controlledIds,
+	);
+	return rowFocused(state, rowOf(model, id), controlledKey);
+}
+
+const view = (
+	state: TreeInteractionState,
+	model: TreeModel,
+	controlledIds: readonly string[] = [],
+) => deriveTreeInteractionView(state, model, controlledIds);
+
+const transition = (
+	state: TreeInteractionState,
+	commands: Parameters<typeof transitionTree>[1],
+	model: TreeModel,
+	overrides: {
+		expandedIds?: readonly string[];
+		controlledIds?: readonly string[];
+		multiSelect?: boolean;
+		now?: number;
+	} = {},
+) =>
+	transitionTree(state, commands, {
+		model,
+		controlledIds: overrides.controlledIds ?? [],
+		expandedIds: overrides.expandedIds ?? ["parent"],
+		multiSelect: overrides.multiSelect ?? false,
+		now: overrides.now ?? 0,
+	});
+
+describe("deriveTreeInteractionView", () => {
+	it("returns the state untouched while every remembered row still exists", () => {
+		const state = focusRow("child", OPEN);
+		expect(view(state, OPEN).state).toBe(state);
+		expect(view(state, OPEN).focusedId).toBe("child");
+	});
+
+	it("keeps focus on a row a collapse only hid", () => {
+		const hidden = view(focusRow("child", OPEN), CLOSED);
+		expect(hidden.state.focusTarget?.id).toBe("child");
+		expect(hidden.focusedId).toBeUndefined();
+		// The tab stop stays away from the first row, which would move the user.
+		expect(hidden.tabStopId).toBeUndefined();
+	});
+
+	it("falls back to the nearest visible ancestor when the row is gone", () => {
+		const removed = createTreeModel(
+			[{ id: "parent", label: "Parent", children: [] }, NODES[1]],
+			new Set(["parent"]),
+		);
+		const reconciled = view(focusRow("child", OPEN), removed);
+		expect(reconciled.state.focusTarget?.id).toBe("parent");
+		expect(reconciled.state.tabTargetId).toBe("parent");
+		expect(reconciled.focusedId).toBe("parent");
+	});
+
+	it("gives an unclaimed selection the tab stop, until focus claims it", () => {
+		const state = focusRow("parent", OPEN);
+		expect(view(state, OPEN, ["last"]).tabStopId).toBe("last");
+		const claimed = transition(
+			state,
+			[
+				{
+					type: "select",
+					id: "last",
+					toggle: false,
+					range: false,
+					preserveHidden: true,
+				},
+			],
+			OPEN,
+		);
+		expect(view(claimed.state, OPEN, ["last"]).tabStopId).toBe("parent");
+	});
+
+	it("draws guides down to the selected row, and the focused one when in focus", () => {
+		const selected = view(initialTreeInteractionState([]), OPEN, ["child"]);
+		expect([...selected.guideOwnerIds]).toEqual(["parent"]);
+		const blurred = view(focusRow("child", OPEN), OPEN);
+		expect([...blurred.guideOwnerIds]).toEqual([]);
+	});
+});
+
+describe("transitionTree", () => {
+	it("clears the selection on dismiss, and focus only when asked", () => {
+		const state = focusRow("child", OPEN, ["child"]);
+		const selectionOnly = transition(
+			state,
+			[{ type: "dismiss", clearSelection: true, clearFocus: false }],
+			OPEN,
+			{ controlledIds: ["child"] },
+		);
+		expect(selectionOnly.selection).toEqual([]);
+		expect(selectionOnly.state.focusTarget?.id).toBe("child");
+
+		const cleared = transition(
+			state,
+			[{ type: "dismiss", clearSelection: true, clearFocus: true }],
+			OPEN,
+			{ controlledIds: ["child"] },
+		);
+		expect(cleared.state.focusTarget).toBeUndefined();
+		// Tab still returns to where the user was.
+		expect(cleared.state.tabTargetId).toBe("child");
+	});
+
+	it("moves focus within the visible rows, clamped at both ends", () => {
+		const state = focusRow("parent", OPEN);
+		const down = transition(
+			state,
+			[{ type: "move", id: "parent", offset: 1, page: false, extend: false }],
+			OPEN,
+		);
+		expect(down.state.focusTarget?.id).toBe("child");
+		const up = transition(
+			state,
+			[{ type: "move", id: "parent", offset: -1, page: false, extend: false }],
+			OPEN,
+		);
+		expect(up.state.focusTarget?.id).toBe("parent");
+	});
+
+	it("emits expansion in tree order, keeping ids the data does not have yet", () => {
+		const expanded = transition(
+			initialTreeInteractionState([]),
+			[{ type: "toggle", id: "parent", recursive: false }],
+			CLOSED,
+			{ expandedIds: ["ghost"] },
+		);
+		expect(expanded.expandedIds).toEqual(["parent", "ghost"]);
+	});
+
+	it("toggles every branch under a recursive toggle", () => {
+		const nested = createTreeModel(
+			[
+				{
+					id: "root",
+					label: "Root",
+					children: [
+						{ id: "one", label: "One", children: [] },
+						{ id: "two", label: "Two", children: [] },
+					],
+				},
+			],
+			new Set(["one"]),
+		);
+		const expanded = transition(
+			initialTreeInteractionState([]),
+			[{ type: "toggle", id: "root", recursive: true }],
+			nested,
+			{ expandedIds: ["one"] },
+		);
+		expect(expanded.expandedIds).toEqual(["root", "one", "two"]);
+	});
+});
+
+describe("multi-selection", () => {
+	const withSelection = (ids: readonly string[]) => ({
+		controlledIds: ids,
+		multiSelect: true,
+	});
+
+	it("keeps the anchor when a controlled selection only reorders", () => {
+		const state = initialTreeInteractionState(["child", "last"]);
+		expect(view(state, OPEN, ["last", "child"]).anchorId).toBe("child");
+	});
+
+	it("adds to and removes from the selection when toggling", () => {
+		const added = transition(
+			initialTreeInteractionState(["child"]),
+			[
+				{
+					type: "select",
+					id: "last",
+					toggle: true,
+					range: false,
+					preserveHidden: true,
+				},
+			],
+			OPEN,
+			withSelection(["child"]),
+		);
+		expect(added.selection).toEqual(["child", "last"]);
+		const removed = transition(
+			initialTreeInteractionState(["child", "last"]),
+			[
+				{
+					type: "select",
+					id: "last",
+					toggle: true,
+					range: false,
+					preserveHidden: true,
+				},
+			],
+			OPEN,
+			withSelection(["child", "last"]),
+		);
+		expect(removed.selection).toEqual(["child"]);
+	});
+
+	it("selects the range from the anchor, in tree order", () => {
+		const anchored = focusRow("parent", OPEN, ["parent"]);
+		const ranged = transition(
+			anchored,
+			[
+				{
+					type: "select",
+					id: "last",
+					toggle: false,
+					range: true,
+					preserveHidden: false,
+				},
+			],
+			OPEN,
+			withSelection(["parent"]),
+		);
+		expect(ranged.selection).toEqual(["parent", "child", "last"]);
+	});
+
+	it("extends the selection as a Shift move travels", () => {
+		const extended = transition(
+			initialTreeInteractionState(["parent"]),
+			[{ type: "move", id: "parent", offset: 1, page: false, extend: true }],
+			OPEN,
+			withSelection(["parent"]),
+		);
+		expect(extended.selection).toEqual(["parent", "child"]);
+		expect(extended.state.focusTarget?.id).toBe("child");
+	});
+
+	it("moves a page by the offset the scroller measured", () => {
+		const paged = transition(
+			initialTreeInteractionState([]),
+			[{ type: "move", id: "parent", offset: 1, page: true, extend: false }],
+			OPEN,
+		);
+		expect(paged.state.focusTarget?.id).toBe("child");
+	});
+
+	it("scopes select-all to the sibling group, then widens to the parent", () => {
+		const group = transition(
+			initialTreeInteractionState([]),
+			[{ type: "selectScope", id: "child" }],
+			OPEN,
+			withSelection([]),
+		);
+		expect(group.selection).toEqual(["child"]);
+		const widened = transition(
+			initialTreeInteractionState(["child"]),
+			[{ type: "selectScope", id: "child" }],
+			OPEN,
+			withSelection(["child"]),
+		);
+		expect(widened.selection).toEqual(["parent", "child"]);
+	});
+
+	it("resets the anchor on dismiss", () => {
+		const dismissed = transition(
+			focusRow("child", OPEN, ["child"]),
+			[{ type: "dismiss", clearSelection: true, clearFocus: false }],
+			OPEN,
+			{ controlledIds: ["child"] },
+		);
+		expect(dismissed.state.anchorId).toBeUndefined();
+	});
+
+	it("buffers type-ahead keys until the query expires", () => {
+		const first = transition(
+			initialTreeInteractionState([]),
+			[{ type: "typeahead", id: "parent", key: "l" }],
+			OPEN,
+			{ now: 1000 },
+		);
+		expect(first.state.focusTarget?.id).toBe("last");
+		expect(first.state.typeQuery).toBe("l");
+		// Within the window the keys join into one query; after it they do not.
+		const joined = transition(
+			first.state,
+			[{ type: "typeahead", id: "last", key: "a" }],
+			OPEN,
+			{ now: 1100 },
+		);
+		expect(joined.state.typeQuery).toBe("la");
+		const expired = transition(
+			first.state,
+			[{ type: "typeahead", id: "last", key: "a" }],
+			OPEN,
+			{ now: 9000 },
+		);
+		expect(expired.state.typeQuery).toBe("a");
+	});
+});
diff --git a/test/webview/workspaces/useWorkspaces.test.tsx b/test/webview/workspaces/useWorkspaces.test.tsx
new file mode 100644
index 0000000000..cb783d70e5
--- /dev/null
+++ b/test/webview/workspaces/useWorkspaces.test.tsx
@@ -0,0 +1,67 @@
+import { act, renderHook } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+import { WorkspacesApi, type WorkspacesState } from "@repo/shared";
+import { useWorkspaces } from "@repo/workspaces/hooks/useWorkspaces";
+
+// The webview may acquire the VS Code API once per page, so one stub serves
+// every test and forwards to the sink the current test installed.
+let sink: unknown[] = [];
+vi.stubGlobal("acquireVsCodeApi", () => ({
+	postMessage: (message: unknown) => sink.push(message),
+	getState: () => undefined,
+	setState: () => {},
+}));
+
+const STATE: WorkspacesState = {
+	capabilities: { authenticated: true, filters: ["mine"] },
+	filter: "mine",
+	workspaces: [],
+	status: { kind: "ready" },
+	metadata: {},
+};
+
+function setup() {
+	const sent: unknown[] = [];
+	sink = sent;
+	return { sent, ...renderHook(() => useWorkspaces()) };
+}
+
+/** Push the state the way the extension does. */
+const push = (state: WorkspacesState) =>
+	act(async () => {
+		window.dispatchEvent(
+			new MessageEvent("message", {
+				data: { type: WorkspacesApi.stateChanged.method, data: state },
+			}),
+		);
+		await Promise.resolve();
+	});
+
+describe("useWorkspaces", () => {
+	it("asks for the state, then replaces its own with each push", async () => {
+		const { sent, result } = setup();
+		expect(sent).toEqual([
+			{ method: WorkspacesApi.ready.method, params: undefined },
+		]);
+		expect(result.current.state).toBeUndefined();
+
+		await push(STATE);
+		expect(result.current.state).toEqual(STATE);
+
+		const failed: WorkspacesState = {
+			...STATE,
+			status: { kind: "failed", error: "down" },
+		};
+		await push(failed);
+		expect(result.current.state).toEqual(failed);
+	});
+
+	it("stops applying pushes once unmounted", async () => {
+		const { result, unmount } = setup();
+		await push(STATE);
+		unmount();
+		await push({ ...STATE, filter: "shared" });
+		expect(result.current.state).toEqual(STATE);
+	});
+});
diff --git a/vitest.config.mts b/vitest.config.mts
index 3cc835357f..88ec0b90d9 100644
--- a/vitest.config.mts
+++ b/vitest.config.mts
@@ -51,6 +51,10 @@ export default defineConfig({
 							"packages/tasks/src",
 						),
 						"@repo/ui": path.resolve(import.meta.dirname, "packages/ui/src"),
+						"@repo/workspaces": path.resolve(
+							import.meta.dirname,
+							"packages/workspaces/src",
+						),
 						"@repo/netcheck": path.resolve(
 							import.meta.dirname,
 							"packages/netcheck/src",