@workbench-kit/react 0.0.2-prototype.0.2.32 → 0.0.2-prototype.0.2.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workbench-kit/react",
-  "version": "0.0.2-prototype.0.2.32",
+  "version": "0.0.2-prototype.0.2.34",
   "private": false,
   "sideEffects": [
     "**/*.css"
@@ -73,15 +73,15 @@
     "@vscode/codicons": "^0.0.45",
     "remark-gfm": "^4.0.1",
     "rehype-sanitize": "^6.0.0",
-    "@workbench-kit/contracts": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/adapters": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/monaco": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/tokens": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/platform": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/runtime": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/workspace": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/services": "0.0.2-prototype.0.2.32",
-    "@workbench-kit/jdw": "0.0.2-prototype.0.2.32"
+    "@workbench-kit/jdw": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/adapters": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/contracts": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/monaco": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/platform": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/tokens": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/services": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/workspace": "0.0.2-prototype.0.2.34",
+    "@workbench-kit/runtime": "0.0.2-prototype.0.2.34"
   },
   "peerDependencies": {
     "react": "^19.0.0",

package/src/index.ts

@@ -19,6 +19,11 @@ export type {
   WorkbenchIconResolver,
 } from './icons';
 export { commandMenuItemsToContextMenuItems } from './workbench/commands/commands';
+export type {
+  ExtensionManagementEntry,
+  ExtensionManagementPanelProps,
+  ExtensionManagementTransition,
+} from './workbench/management';
 export {
   WorkbenchArtifactModeControls,
   WorkbenchArtifactPreview,
@@ -213,15 +218,20 @@ export type {
 export {
   createPointerPassthroughController,
   isPointerOverHitRegion,
+  resolvePointerHitTarget,
 } from './overlay/pointerPassthroughRegion';
 export type {
+  PointerHitTestDocument,
   PointerOverHitRegionOptions,
   PointerPassthroughController,
   PointerPassthroughControllerOptions,
   PointerPassthroughPort,
 } from './overlay/pointerPassthroughRegion';
 export { usePointerPassthroughRegion } from './overlay/usePointerPassthroughRegion';
-export type { UsePointerPassthroughRegionOptions } from './overlay/usePointerPassthroughRegion';
+export type {
+  PointerHitTargetResolver,
+  UsePointerPassthroughRegionOptions,
+} from './overlay/usePointerPassthroughRegion';
 export {
   getWorkbenchStatusDescriptor,
   getWorkbenchStatusLabel,
@@ -743,6 +753,7 @@ export {
 } from './workbench/editor/editorTabContextMenu';
 export type {
   CreateWorkbenchStandaloneEditorTabCommandContextInput,
+  CreateWorkbenchStandaloneEditorTabContextMenuItemsInput,
   WorkbenchStandaloneEditorTabLike,
 } from './workbench/editor/editorTabContextMenu';
 export { useWorkbenchEditorTabContextMenu } from './workbench/editor/useWorkbenchEditorTabContextMenu';

package/src/overlay/ContextMenu.tsx

@@ -1,5 +1,5 @@
 import './context-menu.css';
-import { useEffect, useMemo, useRef, useState, type KeyboardEvent } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState, type KeyboardEvent } from 'react';
 import { Button } from '../primitives/button';
 import { cxCodicon } from '../utils/codicon';
 import { cx } from '../utils/cx';
@@ -13,6 +13,8 @@ export interface ContextMenuProps {
   ariaLabel?: string | undefined;
   className?: string | undefined;
   items: ContextMenuItem[];
+  /** Explicit focus target restored only when Escape dismisses the menu. */
+  returnFocusTarget?: HTMLElement | null | undefined;
   x: number;
   y: number;
   onClose: () => void;
@@ -77,18 +79,33 @@ export function ContextMenu({
   ariaLabel = 'Context menu',
   className,
   items,
+  returnFocusTarget,
   x,
   y,
   onClose,
 }: ContextMenuProps) {
   const ref = useRef<HTMLDivElement>(null);
+  const [fallbackReturnFocusTarget] = useState<HTMLElement | null>(() => {
+    if (typeof document === 'undefined') {
+      return null;
+    }
+    return document.activeElement instanceof HTMLElement ? document.activeElement : null;
+  });
   const position = useClampedFixedOverlayPosition(ref, { x, y }, items.length);
   const hasIcons = menuHasIcons(items);
   const hasShortcuts = menuHasShortcuts(items);
   const enabledIndexes = useMemo(() => getEnabledItemIndexes(items), [items]);
   const [highlightedIndex, setHighlightedIndex] = useState(() => enabledIndexes[0] ?? -1);
 
-  useFixedOverlayDismiss({ containerRef: ref, onClose });
+  const restoreFocusOnEscape = useCallback(() => {
+    const target = returnFocusTarget ?? fallbackReturnFocusTarget;
+    if (target?.isConnected) {
+      target.focus();
+    }
+    return false;
+  }, [fallbackReturnFocusTarget, returnFocusTarget]);
+
+  useFixedOverlayDismiss({ containerRef: ref, onClose, onEscape: restoreFocusOnEscape });
 
   useEffect(() => {
     const handleContextMenu = (event: MouseEvent) => {

package/src/overlay/index.ts

@@ -20,12 +20,17 @@ export type {
 export {
   createPointerPassthroughController,
   isPointerOverHitRegion,
+  resolvePointerHitTarget,
 } from './pointerPassthroughRegion';
 export type {
+  PointerHitTestDocument,
   PointerOverHitRegionOptions,
   PointerPassthroughController,
   PointerPassthroughControllerOptions,
   PointerPassthroughPort,
 } from './pointerPassthroughRegion';
 export { usePointerPassthroughRegion } from './usePointerPassthroughRegion';
-export type { UsePointerPassthroughRegionOptions } from './usePointerPassthroughRegion';
+export type {
+  PointerHitTargetResolver,
+  UsePointerPassthroughRegionOptions,
+} from './usePointerPassthroughRegion';

package/src/overlay/pointerPassthroughRegion.ts

@@ -2,6 +2,22 @@ export interface PointerPassthroughPort {
   setPointerPassthrough(enabled: boolean): void | Promise<void>;
 }
 
+export interface PointerHitTestDocument {
+  elementFromPoint(x: number, y: number): Element | null;
+}
+
+/** Resolve the painted element at finite viewport coordinates. */
+export function resolvePointerHitTarget(
+  clientX: number,
+  clientY: number,
+  documentSurface: PointerHitTestDocument = document,
+): Element | null {
+  if (!Number.isFinite(clientX) || !Number.isFinite(clientY)) {
+    return null;
+  }
+  return documentSurface.elementFromPoint(clientX, clientY);
+}
+
 export interface PointerOverHitRegionOptions {
   readonly hitSelectors: readonly string[];
   readonly controlSelectors?: readonly string[];

package/src/overlay/usePointerPassthroughRegion.ts

@@ -2,9 +2,12 @@ import { useEffect, useRef, type RefObject } from 'react';
 
 import {
   createPointerPassthroughController,
+  resolvePointerHitTarget,
   type PointerPassthroughPort,
 } from './pointerPassthroughRegion';
 
+export type PointerHitTargetResolver = (clientX: number, clientY: number) => EventTarget | null;
+
 export interface UsePointerPassthroughRegionOptions {
   readonly enabled: boolean;
   readonly port: PointerPassthroughPort;
@@ -14,11 +17,15 @@ export interface UsePointerPassthroughRegionOptions {
   readonly controlSelectors?: readonly string[];
   /** Limit hit-testing to a subtree; defaults to the document. */
   readonly rootRef?: RefObject<HTMLElement | null>;
+  /** Override painted-element resolution; defaults to `document.elementFromPoint`. */
+  readonly resolveHitTarget?: PointerHitTargetResolver;
 }
 
 /**
  * Toggles host pointer passthrough from renderer hit-testing.
- * Uses `requestAnimationFrame` coalescing for pointermove; no product selectors in kit.
+ * Uses `requestAnimationFrame` coalescing and painted-element hit-testing; no
+ * product selectors in kit. Electron can forward move events while ignoring
+ * mouse input, in which case `event.target` is not necessarily under the cursor.
  *
  * Host responsibilities:
  * - Provide selector lists
@@ -26,7 +33,7 @@ export interface UsePointerPassthroughRegionOptions {
  * - Pair with platform residency applicator for the main-process half
  */
 export function usePointerPassthroughRegion(options: UsePointerPassthroughRegionOptions): void {
-  const { enabled, port, hitSelectors, controlSelectors, rootRef } = options;
+  const { enabled, port, hitSelectors, controlSelectors, rootRef, resolveHitTarget } = options;
 
   const portRef = useRef(port);
   portRef.current = port;
@@ -34,6 +41,8 @@ export function usePointerPassthroughRegion(options: UsePointerPassthroughRegion
   hitSelectorsRef.current = hitSelectors;
   const controlSelectorsRef = useRef(controlSelectors);
   controlSelectorsRef.current = controlSelectors;
+  const resolveHitTargetRef = useRef(resolveHitTarget ?? resolvePointerHitTarget);
+  resolveHitTargetRef.current = resolveHitTarget ?? resolvePointerHitTarget;
 
   useEffect(() => {
     const controller = createPointerPassthroughController({
@@ -58,25 +67,45 @@ export function usePointerPassthroughRegion(options: UsePointerPassthroughRegion
     }
 
     let frame = 0;
-    let pendingTarget: EventTarget | null = null;
+    let pendingX = 0;
+    let pendingY = 0;
 
     const flush = () => {
       frame = 0;
-      controller.handlePointerTarget(pendingTarget);
+      // Re-assert on every frame. Host state may also change outside this hook;
+      // the main-process port should make same-value updates a no-op.
+      controller.reset();
+      controller.handlePointerTarget(resolveHitTargetRef.current(pendingX, pendingY));
     };
 
-    const onPointerMove = (event: PointerEvent) => {
-      pendingTarget = event.target;
+    const onPointerMove = (event: PointerEvent | MouseEvent) => {
+      pendingX = event.clientX;
+      pendingY = event.clientY;
       if (frame !== 0) {
         return;
       }
       frame = window.requestAnimationFrame(flush);
     };
 
+    const onMouseLeave = () => {
+      if (frame !== 0) {
+        window.cancelAnimationFrame(frame);
+        frame = 0;
+      }
+      controller.reset();
+      controller.handlePointerTarget(null);
+    };
+
     window.addEventListener('pointermove', onPointerMove, { passive: true });
+    // Some Electron builds forward mousemove rather than pointermove while the
+    // native window ignores input.
+    window.addEventListener('mousemove', onPointerMove, { passive: true });
+    document.documentElement.addEventListener('mouseleave', onMouseLeave);
 
     return () => {
       window.removeEventListener('pointermove', onPointerMove);
+      window.removeEventListener('mousemove', onPointerMove);
+      document.documentElement.removeEventListener('mouseleave', onMouseLeave);
       if (frame !== 0) {
         window.cancelAnimationFrame(frame);
       }

package/src/workbench/commands/commands.ts

@@ -23,6 +23,7 @@ export const WORKBENCH_EDITOR_SPLIT_RIGHT_COMMAND_ID = 'editor.splitRight';
 export const WORKBENCH_EDITOR_SPLIT_DOWN_COMMAND_ID = 'editor.splitDown';
 export const WORKBENCH_EDITOR_CLOSE_COMMAND_ID = 'editor.close';
 export const WORKBENCH_EDITOR_CLOSE_OTHERS_COMMAND_ID = 'editor.closeOthers';
+export const WORKBENCH_EDITOR_CLOSE_TO_RIGHT_COMMAND_ID = 'editor.closeToRight';
 export const WORKBENCH_EDITOR_CLOSE_ALL_COMMAND_ID = 'editor.closeAll';
 export const WORKBENCH_EDITOR_DELETE_COMMAND_ID = 'editor.delete';
 export const WORKBENCH_WORKSPACE_NEW_FILE_COMMAND_ID = 'workspace.newFile';
@@ -113,6 +114,8 @@ export interface WorkbenchShellCommandPresetOptions<TActivityId extends string =
 export interface WorkbenchEditorCommandContext {
   canCloseAll: boolean;
   canCloseOthers: boolean;
+  /** Optional so existing public command-context object literals remain source-compatible. */
+  canCloseToRight?: boolean | undefined;
   canClosePath: boolean;
   canCopyPath: boolean;
   canDeletePath: boolean;
@@ -123,6 +126,8 @@ export interface WorkbenchEditorCommandContext {
   canTogglePinned: boolean;
   closeAll: () => void;
   closeOthers: () => void;
+  /** Presence advertises support and makes Close to the right visible. */
+  closeToRight?: (() => void) | undefined;
   closePath: () => void;
   copyPath: () => void;
   deletePath: () => void;
@@ -342,6 +347,14 @@ export function createWorkbenchEditorCommands({
         label: 'Close others',
         run: ({ closeOthers }) => closeOthers(),
       },
+      {
+        id: WORKBENCH_EDITOR_CLOSE_TO_RIGHT_COMMAND_ID,
+        icon: 'codicon-close-all',
+        isEnabled: ({ canCloseToRight, filePath }) => Boolean(filePath && canCloseToRight),
+        isVisible: ({ closeToRight }) => Boolean(closeToRight),
+        label: 'Close to the right',
+        run: ({ closeToRight }) => closeToRight?.(),
+      },
       {
         id: WORKBENCH_EDITOR_CLOSE_ALL_COMMAND_ID,
         icon: 'codicon-close-all',
@@ -407,6 +420,9 @@ export function createWorkbenchStandaloneEditorTabMenuEntries(): CommandMenuEntr
     commandMenuEntry<WorkbenchEditorCommandContext>(WORKBENCH_EDITOR_CLOSE_OTHERS_COMMAND_ID, {
       surfaces: [WORKBENCH_COMMAND_SURFACE_EDITOR],
     }),
+    commandMenuEntry<WorkbenchEditorCommandContext>(WORKBENCH_EDITOR_CLOSE_TO_RIGHT_COMMAND_ID, {
+      surfaces: [WORKBENCH_COMMAND_SURFACE_EDITOR],
+    }),
     commandMenuEntry<WorkbenchEditorCommandContext>(WORKBENCH_EDITOR_CLOSE_ALL_COMMAND_ID, {
       surfaces: [WORKBENCH_COMMAND_SURFACE_EDITOR],
     }),

package/src/workbench/editor/WorkbenchEditorTabs.tsx

@@ -1,7 +1,11 @@
 import { EditorTabs, type EditorTabsProps } from '../../primitives/workbench-editor';
+import type { ContextMenuItem } from '../../overlay/ContextMenu';
 import { useWorkbenchEditorTabContextMenu } from './useWorkbenchEditorTabContextMenu';
 
 export interface WorkbenchEditorTabsProps extends EditorTabsProps {
+  /** Additional host actions appended after the built-in close group. */
+  readonly getExtraTabContextMenuItems?:
+    ((tabId: string) => readonly ContextMenuItem[] | undefined) | undefined;
   /**
    * Optional bulk close. Defaults to calling `onClose` for every closable tab.
    */
@@ -10,26 +14,32 @@ export interface WorkbenchEditorTabsProps extends EditorTabsProps {
    * Optional close-others. Defaults to calling `onClose` for every other closable tab.
    */
   readonly onCloseOthers?: ((tabId: string) => void) | undefined;
+  /** Optional close-to-right override. Defaults to closing each later closable tab. */
+  readonly onCloseToRight?: ((tabId: string) => void) | undefined;
 }
 
 /**
- * Editor tab strip with a built-in Close / Close others / Close all context menu.
+ * Editor tab strip with a built-in Close / Close others / Close to the right / Close all menu.
  * Intended for `WorkbenchStandaloneShell` secondary areas that own tab state in the host.
- * Tabs with `closable: false` keep Close disabled and are skipped by Close others / Close all.
+ * Tabs with `closable: false` keep Close disabled and are skipped by every bulk close action.
  */
 export function WorkbenchEditorTabs({
+  getExtraTabContextMenuItems,
   onClose,
   onCloseAll,
   onCloseOthers,
+  onCloseToRight,
   onSelect,
   onTabContextMenu,
   tabs,
   ...props
 }: WorkbenchEditorTabsProps) {
   const tabContextMenu = useWorkbenchEditorTabContextMenu({
+    getExtraTabContextMenuItems,
     onClose: onClose ?? (() => undefined),
     onCloseAll,
     onCloseOthers,
+    onCloseToRight,
     onSelectTab: onSelect,
     tabs,
   });

package/src/workbench/editor/editorTabContextMenu.ts

@@ -29,25 +29,41 @@ export interface CreateWorkbenchStandaloneEditorTabCommandContextInput {
   readonly onClose: (tabId: string) => void;
   readonly onCloseAll?: (() => void) | undefined;
   readonly onCloseOthers?: ((tabId: string) => void) | undefined;
+  readonly onCloseToRight?: ((tabId: string) => void) | undefined;
   readonly tabId: string;
   readonly tabs: readonly WorkbenchStandaloneEditorTabLike[];
 }
 
+export interface CreateWorkbenchStandaloneEditorTabContextMenuItemsInput extends CreateWorkbenchStandaloneEditorTabCommandContextInput {
+  readonly getExtraTabContextMenuItems?:
+    ((tabId: string) => readonly ContextMenuItem[] | undefined) | undefined;
+}
+
 export function createWorkbenchStandaloneEditorTabCommandContext({
   onClose,
   onCloseAll,
   onCloseOthers,
+  onCloseToRight,
   tabId,
   tabs,
 }: CreateWorkbenchStandaloneEditorTabCommandContextInput): WorkbenchEditorCommandContext {
   const targetTab = tabs.find((tab) => tab.id === tabId);
+  const targetIndex = tabs.findIndex((tab) => tab.id === tabId);
   const closableTabIds = tabs.filter(isWorkbenchEditorTabClosable).map((tab) => tab.id);
   const otherClosableTabIds = closableTabIds.filter((id) => id !== tabId);
+  const rightClosableTabIds =
+    targetIndex < 0
+      ? []
+      : tabs
+          .slice(targetIndex + 1)
+          .filter(isWorkbenchEditorTabClosable)
+          .map((tab) => tab.id);
   const canCloseTarget = Boolean(targetTab && isWorkbenchEditorTabClosable(targetTab));
 
   return {
     canCloseAll: closableTabIds.length > 0,
     canCloseOthers: otherClosableTabIds.length > 0,
+    canCloseToRight: rightClosableTabIds.length > 0,
     canClosePath: canCloseTarget,
     canCopyPath: false,
     canDeletePath: false,
@@ -74,6 +90,18 @@ export function createWorkbenchStandaloneEditorTabCommandContext({
         onClose(id);
       }
     },
+    closeToRight: () => {
+      if (rightClosableTabIds.length === 0) {
+        return;
+      }
+      if (onCloseToRight) {
+        onCloseToRight(tabId);
+        return;
+      }
+      for (const id of rightClosableTabIds) {
+        onClose(id);
+      }
+    },
     closePath: () => {
       if (canCloseTarget) {
         onClose(tabId);
@@ -95,11 +123,11 @@ export function createWorkbenchStandaloneEditorTabCommandContext({
 }
 
 export function createWorkbenchStandaloneEditorTabContextMenuItems(
-  input: CreateWorkbenchStandaloneEditorTabCommandContextInput,
+  input: CreateWorkbenchStandaloneEditorTabContextMenuItemsInput,
 ): ContextMenuItem[] {
   const context = createWorkbenchStandaloneEditorTabCommandContext(input);
 
-  return commandMenuItemsToContextMenuItems(
+  const builtInItems = commandMenuItemsToContextMenuItems(
     resolveCommandMenuItems({
       context,
       entries: standaloneEditorTabMenuEntries,
@@ -108,4 +136,15 @@ export function createWorkbenchStandaloneEditorTabContextMenuItems(
     }),
     (commandId) => executeCommand(editorCommandRegistry, commandId, context),
   );
+  const extraItems = input.getExtraTabContextMenuItems?.(input.tabId) ?? [];
+
+  if (extraItems.length === 0) {
+    return builtInItems;
+  }
+
+  return [
+    ...builtInItems,
+    { id: 'standalone-tab-extra-separator', type: 'separator' },
+    ...extraItems,
+  ];
 }

package/src/workbench/editor/useWorkbenchEditorTabContextMenu.tsx

@@ -1,15 +1,18 @@
 import { useCallback, useState, type MouseEvent as ReactMouseEvent, type ReactNode } from 'react';
 
-import { ContextMenu } from '../../overlay/ContextMenu';
+import { ContextMenu, type ContextMenuItem } from '../../overlay/ContextMenu';
 import {
   createWorkbenchStandaloneEditorTabContextMenuItems,
   type WorkbenchStandaloneEditorTabLike,
 } from './editorTabContextMenu';
 
 export interface UseWorkbenchEditorTabContextMenuOptions {
+  readonly getExtraTabContextMenuItems?:
+    ((tabId: string) => readonly ContextMenuItem[] | undefined) | undefined;
   readonly onClose: (tabId: string) => void;
   readonly onCloseAll?: (() => void) | undefined;
   readonly onCloseOthers?: ((tabId: string) => void) | undefined;
+  readonly onCloseToRight?: ((tabId: string) => void) | undefined;
   readonly onSelectTab?: ((tabId: string) => void) | undefined;
   readonly tabs: readonly WorkbenchStandaloneEditorTabLike[];
 }
@@ -20,13 +23,16 @@ export interface UseWorkbenchEditorTabContextMenuResult {
 }
 
 export function useWorkbenchEditorTabContextMenu({
+  getExtraTabContextMenuItems,
   onClose,
   onCloseAll,
   onCloseOthers,
+  onCloseToRight,
   onSelectTab,
   tabs,
 }: UseWorkbenchEditorTabContextMenuOptions): UseWorkbenchEditorTabContextMenuResult {
   const [menuState, setMenuState] = useState<{
+    returnFocusTarget: HTMLElement;
     tabId: string;
     x: number;
     y: number;
@@ -37,7 +43,12 @@ export function useWorkbenchEditorTabContextMenu({
       event.preventDefault();
       event.stopPropagation();
       onSelectTab?.(tabId);
-      setMenuState({ tabId, x: event.clientX, y: event.clientY });
+      setMenuState({
+        returnFocusTarget: event.currentTarget,
+        tabId,
+        x: event.clientX,
+        y: event.clientY,
+      });
     },
     [onSelectTab],
   );
@@ -47,12 +58,15 @@ export function useWorkbenchEditorTabContextMenu({
       <ContextMenu
         ariaLabel="Editor tab menu"
         items={createWorkbenchStandaloneEditorTabContextMenuItems({
+          getExtraTabContextMenuItems,
           onClose,
           onCloseAll,
           onCloseOthers,
+          onCloseToRight,
           tabId: menuState.tabId,
           tabs,
         })}
+        returnFocusTarget={menuState.returnFocusTarget}
         x={menuState.x}
         y={menuState.y}
         onClose={() => setMenuState(null)}

package/src/workbench/editor-tabs/index.ts

@@ -6,6 +6,7 @@ export {
 } from '../editor/editorTabContextMenu';
 export type {
   CreateWorkbenchStandaloneEditorTabCommandContextInput,
+  CreateWorkbenchStandaloneEditorTabContextMenuItemsInput,
   WorkbenchStandaloneEditorTabLike,
 } from '../editor/editorTabContextMenu';
 export { useEditorTabsStripDnd } from '../editor/useEditorTabsStripDnd';

package/src/workbench/index.ts

@@ -298,6 +298,7 @@ export {
   WORKBENCH_EDITOR_CLOSE_ALL_COMMAND_ID,
   WORKBENCH_EDITOR_CLOSE_COMMAND_ID,
   WORKBENCH_EDITOR_CLOSE_OTHERS_COMMAND_ID,
+  WORKBENCH_EDITOR_CLOSE_TO_RIGHT_COMMAND_ID,
   WORKBENCH_EDITOR_COPY_PATH_COMMAND_ID,
   WORKBENCH_EDITOR_DELETE_COMMAND_ID,
   WORKBENCH_EDITOR_DISCARD_CHANGES_COMMAND_ID,
@@ -449,6 +450,7 @@ export type {
   ExtensionManagementEntry,
   ExtensionManagementPanelProps,
   ExtensionManagementSidebarProps,
+  ExtensionManagementTransition,
   KeybindingManagementPanelProps,
   ManagementPanelFrameProps,
   ManagementPanelToolbarProps,
@@ -605,6 +607,7 @@ export {
 } from './editor/editorTabContextMenu';
 export type {
   CreateWorkbenchStandaloneEditorTabCommandContextInput,
+  CreateWorkbenchStandaloneEditorTabContextMenuItemsInput,
   WorkbenchStandaloneEditorTabLike,
 } from './editor/editorTabContextMenu';
 export { useWorkbenchEditorTabContextMenu } from './editor/useWorkbenchEditorTabContextMenu';

package/src/workbench/management/ExtensionManagementPanel.tsx

@@ -24,6 +24,7 @@ import type {
   ExtensionManagementEntry,
   ExtensionManagementFeatureSummary,
   ExtensionManagementPanelProps,
+  ExtensionManagementTransition,
 } from './types.js';
 
 const BROWSE_CATEGORIES = ['all', 'feature', 'editor', 'theme', 'language'] as const;
@@ -46,6 +47,7 @@ export function ExtensionManagementPanel({
   onInstall,
   onRememberInstallTrust,
   onToggleEnabled,
+  onUninstall,
 }: ExtensionManagementPanelProps) {
   const [activeTab, setActiveTab] = useState<'installed' | 'browse'>(
     EXTENSION_MANAGEMENT_DEFAULT_TAB,
@@ -93,6 +95,7 @@ export function ExtensionManagementPanel({
                 summary={`${filteredInstalled.length} of ${installedEntries.length} visible`}
                 onQueryChange={setInstalledQuery}
                 onToggleEnabled={onToggleEnabled}
+                onUninstall={onUninstall}
               />
             ),
           },
@@ -122,7 +125,8 @@ export function ExtensionManagementPanel({
         onSelect={(tabId) => setActiveTab(tabId as 'installed' | 'browse')}
       />
       <ManagementPanelNotice>
-        Installing or toggling extensions reloads the workbench to apply contributions.
+        Eligible unselected theme packs apply immediately. Other extension changes reload the
+        workbench.
       </ManagementPanelNotice>
     </ManagementPanelFrame>
   );
@@ -133,6 +137,7 @@ function InstalledExtensionsTab({
   entries,
   onQueryChange,
   onToggleEnabled,
+  onUninstall,
   query,
   summary,
 }: {
@@ -140,6 +145,7 @@ function InstalledExtensionsTab({
   entries: readonly ExtensionManagementEntry[];
   onQueryChange: (query: string) => void;
   onToggleEnabled?: ExtensionManagementPanelProps['onToggleEnabled'];
+  onUninstall?: ExtensionManagementPanelProps['onUninstall'];
   query: string;
   summary: string;
 }) {
@@ -160,15 +166,27 @@ function InstalledExtensionsTab({
             <li key={entry.id}>
               <ManagementCard
                 actions={
-                  <Button
-                    compact
-                    disabled={!onToggleEnabled || entry.source === 'bundled'}
-                    type="button"
-                    variant={entry.enabled ? 'default' : 'primary'}
-                    onClick={() => onToggleEnabled?.(entry, !entry.enabled)}
-                  >
-                    {entry.enabled ? 'Disable' : 'Enable'}
-                  </Button>
+                  <>
+                    <Button
+                      compact
+                      disabled={!onToggleEnabled || entry.source === 'bundled'}
+                      type="button"
+                      variant={entry.enabled ? 'default' : 'primary'}
+                      onClick={() => onToggleEnabled?.(entry, !entry.enabled)}
+                    >
+                      {entry.enabled ? 'Disable' : 'Enable'}
+                    </Button>
+                    {entry.canUninstall === true && onUninstall ? (
+                      <Button
+                        compact
+                        type="button"
+                        variant="danger"
+                        onClick={() => onUninstall(entry)}
+                      >
+                        Uninstall
+                      </Button>
+                    ) : null}
+                  </>
                 }
                 badges={
                   <>
@@ -180,6 +198,14 @@ function InstalledExtensionsTab({
                         {entry.enabled ? 'Enabled' : 'Disabled'}
                       </Badge>
                     )}
+                    {entry.transition ? (
+                      <Badge
+                        title={entry.transition.message}
+                        variant={extensionTransitionBadgeVariant(entry.transition.kind)}
+                      >
+                        {extensionTransitionLabel(entry.transition.kind)}
+                      </Badge>
+                    ) : null}
                   </>
                 }
                 description={entry.description}
@@ -198,6 +224,22 @@ function InstalledExtensionsTab({
   );
 }
 
+function extensionTransitionLabel(kind: ExtensionManagementTransition['kind']): string {
+  if (kind === 'reloadRequired') {
+    return 'Reload required';
+  }
+  return kind === 'failed' ? 'Failed' : 'Applied';
+}
+
+function extensionTransitionBadgeVariant(
+  kind: ExtensionManagementTransition['kind'],
+): 'accent' | 'danger' | 'muted' {
+  if (kind === 'failed') {
+    return 'danger';
+  }
+  return kind === 'applied' ? 'accent' : 'muted';
+}
+
 function ExtensionFeatureDetails({ entry }: { entry: ExtensionManagementEntry }) {
   const rows = getExtensionFeatureDetailRows(entry.features);
   const diagnostics = entry.diagnostics ?? [];

package/src/workbench/management/ExtensionManagementSidebar.tsx

@@ -26,6 +26,7 @@ import type {
   ExtensionManagementEntry,
   ExtensionManagementFeatureSummary,
   ExtensionManagementPanelProps,
+  ExtensionManagementTransition,
 } from './types.js';
 
 const BROWSE_CATEGORIES = ['all', 'feature', 'editor', 'theme', 'language'] as const;
@@ -43,6 +44,7 @@ export interface ExtensionManagementSidebarProps extends ExtensionManagementPane
   emptyMarketplaceLabel?: string | undefined;
   missingExtensionIds?: readonly string[] | undefined;
   pendingAction?: ExtensionManagementPendingAction | undefined;
+  pendingUninstallEntryId?: string | undefined;
 }
 
 export interface ExtensionManagementPendingAction {
@@ -64,7 +66,9 @@ export function ExtensionManagementSidebar({
   onInstall,
   onRememberInstallTrust,
   onToggleEnabled,
+  onUninstall,
   pendingAction,
+  pendingUninstallEntryId,
 }: ExtensionManagementSidebarProps) {
   const [activeTab, setActiveTab] = useState<'installed' | 'marketplace'>(defaultTab);
   const [query, setQuery] = useState('');
@@ -102,7 +106,8 @@ export function ExtensionManagementSidebar({
       footer={
         <p className="workbench-extensions-sidebar__notice" role="note">
           <i aria-hidden className={cxCodicon('codicon-info')} />
-          Installing or enabling extensions reloads the workbench to apply contributions.
+          Eligible unselected theme packs apply immediately. Other extension changes reload the
+          workbench.
         </p>
       }
       footerPlacement="overlay"
@@ -167,7 +172,9 @@ export function ExtensionManagementSidebar({
           emptyLabel={emptyInstalledLabel}
           entries={filteredInstalled}
           pendingAction={pendingAction}
+          pendingUninstallEntryId={pendingUninstallEntryId}
           onToggleEnabled={onToggleEnabled}
+          onUninstall={onUninstall}
         />
       )}
     </SideBarViewFrame>
@@ -178,12 +185,16 @@ function InstalledExtensionList({
   emptyLabel,
   entries,
   onToggleEnabled,
+  onUninstall,
   pendingAction,
+  pendingUninstallEntryId,
 }: {
   emptyLabel: string;
   entries: readonly ExtensionManagementEntry[];
   onToggleEnabled?: ExtensionManagementPanelProps['onToggleEnabled'];
+  onUninstall?: ExtensionManagementPanelProps['onUninstall'];
   pendingAction?: ExtensionManagementPendingAction | undefined;
+  pendingUninstallEntryId?: string | undefined;
 }) {
   if (entries.length === 0) {
     return (
@@ -198,6 +209,8 @@ function InstalledExtensionList({
       {entries.map((entry) => {
         const isPendingToggle =
           pendingAction?.kind === 'toggle' && pendingAction.entryId === entry.id;
+        const isPendingUninstall = pendingUninstallEntryId === entry.id;
+        const isPending = isPendingToggle || isPendingUninstall;
         const errorDiagnostics = (entry.diagnostics ?? []).filter(
           (diagnostic) => diagnostic.severity === 'error',
         );
@@ -209,15 +222,28 @@ function InstalledExtensionList({
           <ExtensionSidebarListItem
             key={entry.id}
             action={
-              <Button
-                compact
-                disabled={!onToggleEnabled || entry.source === 'bundled' || isPendingToggle}
-                type="button"
-                variant={entry.enabled ? 'default' : 'primary'}
-                onClick={() => onToggleEnabled?.(entry, !entry.enabled)}
-              >
-                {isPendingToggle ? 'Reloading…' : entry.enabled ? 'Disable' : 'Enable'}
-              </Button>
+              <>
+                <Button
+                  compact
+                  disabled={!onToggleEnabled || entry.source === 'bundled' || isPending}
+                  type="button"
+                  variant={entry.enabled ? 'default' : 'primary'}
+                  onClick={() => onToggleEnabled?.(entry, !entry.enabled)}
+                >
+                  {isPendingToggle ? 'Reloading…' : entry.enabled ? 'Disable' : 'Enable'}
+                </Button>
+                {entry.canUninstall === true && onUninstall ? (
+                  <Button
+                    compact
+                    disabled={isPending}
+                    type="button"
+                    variant="danger"
+                    onClick={() => onUninstall(entry)}
+                  >
+                    {isPendingUninstall ? 'Reloading…' : 'Uninstall'}
+                  </Button>
+                ) : null}
+              </>
             }
             category={entry.category}
             description={entry.description}
@@ -248,6 +274,14 @@ function InstalledExtensionList({
                     {warningDiagnostics.length} warning{warningDiagnostics.length === 1 ? '' : 's'}
                   </Badge>
                 ) : null}
+                {entry.transition ? (
+                  <Badge
+                    title={entry.transition.message}
+                    variant={extensionTransitionBadgeVariant(entry.transition.kind)}
+                  >
+                    {extensionTransitionLabel(entry.transition.kind)}
+                  </Badge>
+                ) : null}
               </>
             }
             title={entry.displayName}
@@ -258,6 +292,22 @@ function InstalledExtensionList({
   );
 }
 
+function extensionTransitionLabel(kind: ExtensionManagementTransition['kind']): string {
+  if (kind === 'reloadRequired') {
+    return 'Reload required';
+  }
+  return kind === 'failed' ? 'Failed' : 'Applied';
+}
+
+function extensionTransitionBadgeVariant(
+  kind: ExtensionManagementTransition['kind'],
+): 'accent' | 'danger' | 'muted' {
+  if (kind === 'failed') {
+    return 'danger';
+  }
+  return kind === 'applied' ? 'accent' : 'muted';
+}
+
 function MarketplaceExtensionList({
   catalogError,
   catalogLoading,

package/src/workbench/management/index.ts

@@ -141,4 +141,5 @@ export type {
   ExtensionManagementFeatureItem,
   ExtensionManagementFeatureSummary,
   ExtensionManagementPanelProps,
+  ExtensionManagementTransition,
 } from './types.js';

package/src/workbench/management/types.ts

@@ -82,6 +82,11 @@ export interface ExtensionManagementDiagnosticSummary {
   readonly severity: 'error' | 'warning';
 }
 
+export interface ExtensionManagementTransition {
+  readonly kind: 'applied' | 'reloadRequired' | 'failed';
+  readonly message: string;
+}
+
 export interface ExtensionInstallPlanSummary {
   readonly blocked: boolean;
   readonly diagnostics?: readonly ExtensionManagementDiagnosticSummary[] | undefined;
@@ -92,6 +97,8 @@ export interface ExtensionInstallPlanSummary {
 }
 
 export interface ExtensionManagementEntry {
+  /** True only when a persisted installed record currently owns this entry. */
+  readonly canUninstall?: boolean;
   readonly category: string;
   readonly description?: string | undefined;
   readonly diagnostics?: readonly ExtensionManagementDiagnosticSummary[] | undefined;
@@ -102,6 +109,7 @@ export interface ExtensionManagementEntry {
   readonly installedAt?: string | undefined;
   readonly manifestUrl?: string | undefined;
   readonly source: ExtensionManagementEntrySource;
+  readonly transition?: ExtensionManagementTransition;
 }
 
 export interface ExtensionCatalogBrowseEntry {
@@ -128,6 +136,7 @@ export interface ExtensionManagementPanelProps {
   installedEntries: readonly ExtensionManagementEntry[];
   onInstall?:
     ((entry: ExtensionCatalogBrowseEntry, options?: ExtensionInstallOptions) => void) | undefined;
+  onUninstall?: (entry: ExtensionManagementEntry) => void;
   onToggleEnabled?: ((entry: ExtensionManagementEntry, enabled: boolean) => void) | undefined;
   /**
    * Host-owned durable trust check. When true for an entry, the install confirm

package/src/workbench/settings/StructuredDataSchemaPanel.tsx

@@ -6,6 +6,7 @@ import { ScrollArea } from '../../primitives/scroll-area';
 import { cx } from '../../utils/cx';
 import { WorkbenchSectionTabPanel } from './SectionTabPanel';
 import { WorkbenchSectionedPanel } from './SectionedPanel';
+import { getWorkbenchStructuredDataSchemaPathSegments } from './structuredDataSchemaSection';
 import {
   WorkbenchStructuredDataSchemaFieldInput,
   appendWorkbenchStructuredDataSchemaTableRow,
@@ -162,7 +163,10 @@ function getSchemaFieldValue({
   sectionValue: unknown;
 }) {
   const fullPath = getWorkbenchStructuredDataSchemaFieldDataPath(section, fieldPath);
-  const rootValue = getWorkbenchStructuredDataValue(data, fullPath.split('.'));
+  const rootValue = getWorkbenchStructuredDataValue(
+    data,
+    getWorkbenchStructuredDataSchemaPathSegments(fullPath),
+  );
   if (rootValue !== null && rootValue !== undefined) return rootValue;
 
   const record = asWorkbenchStructuredDataRecord(sectionValue);
@@ -170,7 +174,8 @@ function getSchemaFieldValue({
 }
 
 function formatSchemaFieldErrorKey(path: string | readonly string[]) {
-  const segments = typeof path === 'string' ? path.split('.') : path;
+  const segments =
+    typeof path === 'string' ? getWorkbenchStructuredDataSchemaPathSegments(path) : path;
   return segments.filter(Boolean).join('.');
 }
 
@@ -286,7 +291,11 @@ function renderSchemaFormSection({
                   mergedFieldErrors: fieldErrors,
                   onValidateField,
                   value: fieldValue,
-                  onValueChange: (nextValue) => onDataValueChange(dataPath.split('.'), nextValue),
+                  onValueChange: (nextValue) =>
+                    onDataValueChange(
+                      getWorkbenchStructuredDataSchemaPathSegments(dataPath),
+                      nextValue,
+                    ),
                 })
               : null;
 
@@ -358,7 +367,12 @@ function renderSchemaFormSection({
                     readOnly={readOnly}
                     textareaClassName={classNames.settingControlTextarea}
                     value={entry}
-                    onValueChange={(nextValue) => onDataValueChange(dataPath.split('.'), nextValue)}
+                    onValueChange={(nextValue) =>
+                      onDataValueChange(
+                        getWorkbenchStructuredDataSchemaPathSegments(dataPath),
+                        nextValue,
+                      )
+                    }
                   />
                 </div>
               </Field>

package/src/workbench/settings/structuredDataSchema.ts

@@ -19,6 +19,7 @@ import {
 import {
   getWorkbenchStructuredDataSchemaFieldDataPath,
   getWorkbenchStructuredDataSchemaFieldDefinition,
+  getWorkbenchStructuredDataSchemaPathSegments,
   getWorkbenchStructuredDataSchemaSectionFieldLabel,
   getWorkbenchStructuredDataSchemaSectionPath,
 } from './structuredDataSchemaSection';
@@ -206,14 +207,18 @@ export function getWorkbenchStructuredDataSchemaDocumentSectionValue({
   section: WorkbenchStructuredDataSchemaSectionSummary;
 }) {
   const sectionKey = getWorkbenchStructuredDataSchemaSectionPath(section);
-  const record = asWorkbenchStructuredDataRecord(data);
-  if (!sectionKey || !record) return sectionKey ? null : data;
-  if (sectionKey in record) return record[sectionKey];
+  if (!sectionKey) return data;
 
-  const directValue = getWorkbenchStructuredDataValue(data, sectionKey.split('.'));
+  const directValue = getWorkbenchStructuredDataValue(
+    data,
+    getWorkbenchStructuredDataSchemaPathSegments(sectionKey),
+  );
   if (directValue !== null && directValue !== undefined) return directValue;
 
-  for (const path of aliases[sectionKey] ?? []) {
+  const sectionAliases = Object.prototype.hasOwnProperty.call(aliases, sectionKey)
+    ? (aliases[sectionKey] ?? [])
+    : [];
+  for (const path of sectionAliases) {
     if (!path.length) return data;
     const value = getWorkbenchStructuredDataValue(data, path);
     if (value !== null && value !== undefined) return value;
@@ -279,13 +284,17 @@ export function createWorkbenchStructuredDataSchemaDocumentSampleData(
         ? section.columns
         : Object.keys(schemaTable?.items ?? {});
 
-      return setWorkbenchStructuredDataValue(sample, path.split('.'), [
-        createWorkbenchStructuredDataSchemaDocumentEmptyRow({
-          columns,
-          schema,
-          section,
-        }),
-      ]);
+      return setWorkbenchStructuredDataValue(
+        sample,
+        getWorkbenchStructuredDataSchemaPathSegments(path),
+        [
+          createWorkbenchStructuredDataSchemaDocumentEmptyRow({
+            columns,
+            schema,
+            section,
+          }),
+        ],
+      );
     }
 
     return (section.fields ?? []).reduce<WorkbenchStructuredDataRecord>((nextSample, fieldPath) => {
@@ -296,7 +305,9 @@ export function createWorkbenchStructuredDataSchemaDocumentSampleData(
       );
       return setWorkbenchStructuredDataValue(
         nextSample,
-        getWorkbenchStructuredDataSchemaFieldDataPath(section, fieldPath).split('.'),
+        getWorkbenchStructuredDataSchemaPathSegments(
+          getWorkbenchStructuredDataSchemaFieldDataPath(section, fieldPath),
+        ),
         getWorkbenchStructuredDataSchemaFieldDefaultValue(definition),
       );
     }, sample);

package/src/workbench/settings/structuredDataSchemaSection.ts

@@ -21,6 +21,10 @@ export function getWorkbenchStructuredDataSchemaSectionPath(
   return section.sectionKey || section.id || '';
 }
 
+export function getWorkbenchStructuredDataSchemaPathSegments(path: string) {
+  return path ? path.split('.') : [];
+}
+
 export function getWorkbenchStructuredDataSchemaFieldDataPath(
   section: WorkbenchStructuredDataSchemaSectionSummary,
   fieldPath: string,

package/src/workbench/settings/structuredDataSchemaTable.ts

@@ -7,7 +7,10 @@ import type {
   WorkbenchStructuredDataSchemaTableRowKeyInput,
 } from './structuredDataSchemaTypes';
 import { getWorkbenchStructuredDataSchemaFieldDefaultValue } from './structuredDataSchemaField';
-import { getWorkbenchStructuredDataSchemaSectionPath } from './structuredDataSchemaSection';
+import {
+  getWorkbenchStructuredDataSchemaPathSegments,
+  getWorkbenchStructuredDataSchemaSectionPath,
+} from './structuredDataSchemaSection';
 
 export function getWorkbenchStructuredDataSchemaTableRows(
   value: unknown,
@@ -34,7 +37,7 @@ export function getWorkbenchStructuredDataSchemaTablePath(
   section: WorkbenchStructuredDataSchemaSectionSummary,
 ) {
   const tablePath = getWorkbenchStructuredDataSchemaSectionPath(section);
-  return tablePath ? tablePath.split('.') : [];
+  return getWorkbenchStructuredDataSchemaPathSegments(tablePath);
 }
 
 export function getWorkbenchStructuredDataSchemaTableRowKey({

package/src/workbench/shell/shell.ts

@@ -73,6 +73,7 @@ export {
 } from '../editor/editorTabContextMenu';
 export type {
   CreateWorkbenchStandaloneEditorTabCommandContextInput,
+  CreateWorkbenchStandaloneEditorTabContextMenuItemsInput,
   WorkbenchStandaloneEditorTabLike,
 } from '../editor/editorTabContextMenu';
 export { useWorkbenchEditorTabContextMenu } from '../editor/useWorkbenchEditorTabContextMenu';

package/src/workbench/views/extensions-sidebar.css

@@ -112,6 +112,8 @@
 
 .workbench-extensions-sidebar__actions {
   display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
   justify-content: flex-end;
   width: 100%;
 }