You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: .github/skills/sessions/SKILL.md
+8-2Lines changed: 8 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -39,12 +39,18 @@ Then read the relevant spec for the area you are changing (see table below). If
39
39
-**A sash element's `left`/`top` is the hit-area edge, not the split boundary**: `SplitView.getSashPosition` returns the exact boundary after the preceding view, then `Sash.layout` subtracts half the sash size so the draggable element is centered on that boundary. Align the Sessions/Editor and bottom-Panel grid sash hit areas to `agents.layout.floatingPanelGap`; do not apply that token to independent geometry such as the Auxiliary Bar's leading padding.
40
40
-**Wrong menu IDs**: Never use `MenuId.*` from `vs/platform/actions` for Agents window UI. Always use `Menus.*` from `browser/menus.ts`.
41
41
-**Editor-group header existence must not depend on an editor-provided scope**: the group-level `showHeader` option enables both header actions and header-hosted breadcrumbs; each menu item gates itself with an active-editor `when` clause. An editor's optional `scopedInstantiationService` property only supplies context for evaluating those clauses, and breadcrumbs compose into the same fixed-height header row rather than creating a second persistent slot.
42
-
-**Stable header action hosts must stay layout-transparent**: adding wrapper elements around the primary/secondary `MenuWorkbenchToolBar`s can change their established flex sizing and overflow behavior. Use layout-transparent hosts (`display: contents`) when stable DOM ownership is needed, and keep the toolbar boxes participating in the original primary/secondary flex layout.
42
+
-**Editor-header DOM must mirror its visual groups**: breadcrumbs are a direct child of the header and a sibling of one actions container; that actions container directly owns the primary and secondary action hosts. Create the actions container and its hosts inside the `showHeader` construction branch, then attach it after breadcrumbs so ownership and DOM order stay explicit.
43
+
-**Editor-header state belongs to the owned nodes and widgets, not their parent or CSS marker classes**: do not add placement/state classes to the title parent, branch layout on the `showHeader` option after construction, or infer action presence from `has-no-actions`. Use the created header element to distinguish placement and `MenuWorkbenchToolBar.getItemsLength()` to derive visibility; the toolbar may still set its internal compatibility class, but header logic and styling must not depend on it.
44
+
-**Secondary editor-header actions need a structural trailing column**: custom secondary view items can stretch their host, so `margin-left: auto` plus content-sized flex is not sufficient. Use an actions grid with a flexible leading column and explicit secondary/separator/layout columns so secondary-only states remain trailing regardless of child sizing.
45
+
-**Breadcrumbs and editor-header actions share an edge, not a parent gap**: do not add `column-gap` to the header row; it creates a visible hole between the flexed breadcrumb box and actions box. Breadcrumb content owns its trailing breathing room, while the two sibling containers remain contiguous.
46
+
-**Header actions must not retain an empty leading grid track beside breadcrumbs**: when breadcrumbs are visible, make the actions grid content-sized with auto columns; otherwise its flexible primary column becomes a visible hole inside the actions element. Only use the full-width `1fr` primary column when breadcrumbs are absent, where it keeps primary actions left-anchored and secondary/layout actions trailing.
47
+
-**Header breadcrumb layout measures the control, not its padded wrapper**: `.breadcrumbs-below-tabs` has Sessions-owned left padding, and `clientWidth` includes that padding. Pass `breadcrumbsControl.domNode.clientWidth` to `BreadcrumbsControl.layout()` so the widget receives its actual usable width and does not overrun or clip its trailing scroll range.
48
+
-**Header-hosted breadcrumbs inherit the shared header background**: the breadcrumb widget generates a light-theme background on its inner `.monaco-breadcrumbs` surface, which contrasts with the editor-header tab background inherited by sibling actions. Override both the control and inner widget surface to transparent in the Sessions-scoped header breadcrumb stylesheet so the entire row uses one theme-owned surface color.
43
49
-**Hidden header widgets must collapse their parent box**: hiding only an inner control leaves the stable parent with its previous inline width, which can push sibling header actions to the right. Mirror visibility onto the parent container and define the common row height on the shared header, not on one child widget, so Changes actions and file breadcrumbs align without stale geometry.
44
50
-**An empty editor-group header must collapse completely**: keep the stable header content hidden by default and show it only when breadcrumbs are visible or a primary/secondary menu host has actions. Hiding only the children can leave the header border or reserved height visible as an empty row.
45
51
-**Title content spans the full editor-group width**: breadcrumbs and tabs use the full group width in every layout. Only the editor pane is narrowed beside the docked detail panel; do not thread the editor content inset through `EditorTitleControl.layout()`.
46
52
-**Agents header styling must not modify shared editor CSS**: keep `vs/workbench` editor styles byte-for-byte unchanged so normal VS Code windows cannot regress. Add an explicit header-placement class in shared DOM code, then put every visual override under a Sessions-owned stylesheet scoped to `.agent-sessions-workbench.dock-detail-panel`.
47
-
-**Header presentation has its own control**: `EditorGroupView` passes `menuIds` and `showHeader` to `EditorTitleControl`, which creates `EditorHeaderControl` when enabled and hosts breadcrumbs in its leading container. `EditorHeaderControl` owns header DOM, menu toolbars, scoped action rendering, visibility, and fixed height; `EditorTitleControl` owns tabs/breadcrumbs and includes the header height in its total.
53
+
-**Header presentation has its own control**: `EditorGroupView` passes `menuIds` and `showHeader` to `EditorTitleControl`, which creates `EditorHeaderControl` when enabled. `EditorHeaderControl` owns header DOM, breadcrumbs, menu toolbars, scoped action rendering, visibility, and fixed height; `EditorTitleControl` owns tabs and includes the header height in its total.
48
54
-**The title-owned header is a child of the title container and follows its recreate lifecycle**: create it after the tabs inside `EditorTitleControl.parent`, include its height in the title control's layout result, and rebuild it with tabs/breadcrumbs after `clearNode(parent)` when editor options change. Do not make it a sibling that requires separate DOM cleanup and duplicate group layout subtraction.
49
55
-**Header visibility updates distinguish creation from live changes**: `updateHeaderVisibility(relayout)` updates DOM/state in both cases, but creation and option-driven reconstruction pass `false` because their caller already owns layout. Live menu-item and breadcrumb changes pass `true` so the parent group is explicitly relaid out.
50
56
-**Durable chat source/origin references**: Store only `turnId` in durable fork/side-chat references. Active versus historical is mutable lifecycle state that consumers must resolve against the current `activeTurn` and retained `turns` when needed; do not encode lifecycle state in the reference type.
Copy file name to clipboardExpand all lines: src/vs/sessions/LAYOUT.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -255,8 +255,8 @@ The entire third-pane redesign is gated behind the experimental setting `session
255
255
256
256
- The auxiliary bar is removed from the workbench grid and **docked inside the editor part** (absolutely positioned on the right, below the editor tab strip); the grid's top-right row becomes `Sessions | Editor`, and the editor part spans the editor + detail-panel width.
257
257
- The editor group's **tab strip and header-hosted breadcrumbs span the full width**, while the editor content is inset on the right by the detail-panel width via the concrete `EditorPart.setContentRightInset(px)` method (`EditorPart`/`EditorGroupView`; not on the `IEditorPart` interface; `0` = no-op for all other layouts). The detail panel is always docked on the right, so no left margin is needed.
258
-
- A **full-width header** sits below the tab bar, spanning the editor content and docked detail panel. `SinglePaneMainEditorPart.getGroupViewOptions()` enables it with `showHeader` and supplies `Menus.SessionsEditorHeaderPrimary`, `Menus.SessionsEditorHeaderSecondary`, and `Menus.SessionsEditorHeaderLayout`. `EditorHeaderControl` owns the header DOM, evaluates those menus, renders their leading/trailing toolbars, and exposes its fixed visible height to `EditorTitleControl`; the title control hosts breadcrumbs there and includes that height in its layout. The trailing actions toolbar keeps secondary view actions under its `...` overflow. A separator follows that toolbar, then the layout toolbar renders**Hide Editor** and **Toggle Details**. Menu items own their active-editor `when` clauses. `SessionChangesEditor.scopedInstantiationService` only supplies its editor-scoped context for evaluating those clauses; its presence does not control whether the header is created.
259
-
- Text-file breadcrumbs reuse that **same fixed-height header row**. When `IEditorGroupViewOptions.showHeader` is enabled, `EditorTitleControl` creates `BreadcrumbsControl` directly in the header's stable primary region; otherwise it keeps the standard below-tabs placement in the title container. Editors without breadcrumbs or applicable menu actions hide the row and report zero header height.
258
+
- A **full-width header** sits below the tab bar, spanning the editor content and docked detail panel. `SinglePaneMainEditorPart.getGroupViewOptions()` enables it with `showHeader` and supplies `Menus.SessionsEditorHeaderPrimary`, `Menus.SessionsEditorHeaderSecondary`, and `Menus.SessionsEditorHeaderLayout`. `EditorHeaderControl` owns the header DOM, evaluates those menus, renders their toolbars, and exposes its fixed visible height to `EditorTitleControl`; the title control includes that height in its layout. The header directly contains breadcrumbs followed by one actions container. That actions container owns the primary and secondary action hosts, followed by a separator and the layout-action host for**Hide Editor** and **Toggle Details**. Menu items own their active-editor `when` clauses. `SessionChangesEditor.scopedInstantiationService` only supplies its editor-scoped context for evaluating those clauses; its presence does not control whether the header is created.
259
+
- Text-file breadcrumbs reuse that **same fixed-height header row**. When `IEditorGroupViewOptions.showHeader` is enabled, `EditorTitleControl` creates `BreadcrumbsControl` directly in the header; otherwise it keeps the standard below-tabs placement in the title container. Header padding defines the shared left anchor for breadcrumbs and primary actions, so either starts at the same inset when the other is absent. Header-hosted breadcrumbs lay out at their actual flexed width, accounting for the header padding and sibling actions instead of using the full editor-group width. Editors without breadcrumbs or applicable menu actions hide the row and report zero header height.
260
260
- A vertical **sash** on the left edge of the docked panel resizes it (`DockedAuxiliaryBarController` in `browser/dockedAuxiliaryBarController.ts` owns `layout()` / `_ensureSash()`, created/driven by `SinglePaneMainEditorPart`). The preferred first-open width is 300px; explicit user resizes persist via the part-sizes snapshot. While the panel is visible it clamps to `[220px, editorWidth - 300px]`; dragging the raw sash width down to ~0 hides the docked detail panel, leaving the editor content visible. Temporary width growth from collapsing the sessions list is restored before persistence and must not become the user's detail width.
261
261
- Collapsing the sessions list transfers the freed sidebar width to the editor grid node when the editor content is **visible**, and to the **detail panel** (`_dockedAuxiliaryBarWidth`, with the editor node kept equal to it) when the editor content is **hidden** (detail-only). Reopening the sessions list restores the pre-collapse editor-node width / detail width. Keeping the hidden-editor node equal to the detail width ensures the width-based reveal-sync never mistakes a wide detail-only node for a revealed editor.
262
262
- When the editor part is hidden while the docked detail panel remains visible, the editor grid node stays visible for the shared tab strip but shrinks to the persisted detail-panel width, letting the Sessions part absorb the freed editor-content space. The detail panel fills that narrowed node below the tab strip and the editor content area collapses to zero. Its sash remains available so dragging the raw requested detail width below its 220px minimum hides the detail panel; the clamped visible width must not decide this. When a visible editor and its details no longer fit within the node, resize handling hides the details first and leaves editor content visible.
0 commit comments