Skip to main content

What's new in v8

Dockview 8.0 is an additive release focused on the tab header and drag-and-drop: pinned, wrapping and colour-grouped tabs, context menus, an aim-at-a-cell drop compass and floating-group snapping, undo/redo for layout changes, auto-hide edge groups, and keyboard docking across popout windows. Every new capability is opt-in and off by default, so upgrading is safe.

This page covers the headline additions. For the upgrade notes and the single breaking change, see Migrating to v8.

Dockview launches an enterprise version explains why v8 starts shipping a commercially licensed package alongside the free one, and what it means if you already use Dockview.

v8 introduces dockview-enterprise, a separately-licensed package. Most of the additions below are part of it; Licensing is the full free-versus-enterprise list. The free, open-source dockview packages are unchanged.

Highlights​

Pinned tabs​

The new pinnedTabs option lets a panel be pinned to the front of the tab strip, keeping it in place while other tabs come and go. Pinned tabs stay ahead of unpinned ones, are excluded from the overflow dropdown, and can render compact (icon-only, hiding the title and close button, Chrome-style) or on a separate row. Pin and unpin by dragging tabs into or out of that separate row, from the keyboard with Ctrl+Shift+Enter, or from the built-in tab context menu via the new 'pin' item; in inline mode pinned tabs can stay stuck to the left edge as the strip scrolls. Pinning round-trips through serialization.

Multi-row (wrapping) tabs & overflow​

The new overflow option controls what happens when there are more tabs than fit on one row. The default single-row strip with a chevron dropdown is unchanged; setting overflow.mode: 'wrap' instead wraps the tabs onto multiple rows and grows the header to fit, with full cross-row drag-and-drop reordering. Cap the growth with overflow.maxRows and the surplus rows spill back into the dropdown, or upgrade the dropdown itself into a searchable, most-recently-used tab switcher with overflow.search and overflow.mru. Wrapping applies to vertical (edge-group) headers too, filling additional columns instead of rows. See Multi-row tabs.

Advanced overflow​

The overflow dropdown can now become a command-palette style tab switcher in place: a search box that filters the group's tabs, most-recently-used ordering, and full keyboard navigation. The chevron trigger and count badge are unchanged, only the popover body. It is configured through the same overflow option via overflow.search and overflow.mru, and the fields are safe to leave set on the free package, where the plain list renders exactly as before. See Advanced overflow.

Tab groups (free)​

Tabs within a group can now be organised visually with coloured chips. Tabs can be grouped, collapsed, expanded, recoloured, and reordered by drag and drop, with a custom chip renderer if you want to draw them yourself, and grouping round-trips through serialization. Build groups through api.createTabGroup, api.addPanelToTabGroup and api.removePanelFromTabGroup, and tune the palette with the new tabGroupColors and tabGroupAccent options.

See Tab groups.

Context menus​

Dockview can now show a context menu when you right-click a tab or a tab group chip. Menus are opt-in: nothing appears unless you supply a builder through the new getTabContextMenuItems or getTabGroupChipContextMenuItems, which returns a list mixing built-in string shortcuts (such as the new 'pin' item) with your own label or component items. Return an empty array to suppress the menu for a particular tab. See Context menus.

DnD compass​

The new dndCompass option replaces the cursor-quadrant drop logic with a VS Code-style "compass" that highlights the cell you are aiming at while dragging, and previews docking a group to the whole-layout edge. For finer control, the new dropPositionResolver option lets you override how a pointer location maps to a drop position on the group and layout-edge targets. See DnD compass.

Smart guides​

The new smartGuides option adds Figma-style alignment guides and magnetic snapping while a floating group is dragged. Edges and centres snap to other floating groups, the container, and optionally the underlying grid splitters, with asymmetric hysteresis to stop boundary oscillation; a modifier key temporarily suspends snapping, and flush floats can snap together into a docked or merged group. See Smart guides.

Layout history (undo/redo)​

The new layoutHistory option records structural layout mutations and lets you undo and redo them (move, float, popout, maximize, add, remove, and tab-group changes) coalescing resize gestures and spanning popout windows. See Layout history.

Auto-hide edge groups​

Groups docked against an edge of the layout can now collapse to a strip and peek back into view on demand, VS Code tool-window style. Enable it with the new autoHideEdgeGroups option; clicking a collapsed tab peeks the group, and you can pin it back to a docked group or dismiss it. Auto-hide is resolved per edge (and can be toggled per group via addEdgeGroup({ autoHide }) / api.getEdgeGroup(position)?.setAutoHide(...)), so a static and an auto-hiding edge group can co-exist; peek animation is tuned globally through the new edgeGroupPeek option. See Auto-hide edge groups.

Dock to edge groups​

The new dockToEdgeGroups option makes an edge behave like a VS Code sidebar: an edge with no content takes up zero space, a drop zone for it appears only while dragging, and dropping a panel on the far edge docks an edge group there. A newly revealed edge is created collapsed, and when its last panel leaves it tears down to zero footprint again. It composes with the DnD compass (outer ring docks to the grid edge; the true outer band docks an edge group) and with auto-hide, and can be driven programmatically via api.revealEdgeGroupWithData. See Dock to edge groups.

Keyboard docking across popout windows & refreshed a11y​

Keyboard docking now works across popout windows, so you can move the active panel into or out of a popout entirely from the keyboard, with a dedicated "float" terminal action that lifts it into a floating group. It builds on refreshed accessibility work: per-window live regions with focus-aware routing, :focus-visible focus indicators, and honest, localised accessible names on tab controls. See Keyboard navigation and Accessibility.

Breaking changes​

v8 is additive; every new feature above is opt-in and off by default. There is one behavioural change and one method rename to be aware of, both covered in full in Migrating to v8:

  • Reported panel dimensions: onDidDimensionsChange (and the height passed to renderers) now report the content area (the group box minus the header) instead of the header-inclusive group box. CSS-fill renderers are unaffected; only consumers that read the numeric dimensions need to check this.
  • api.moveToNext / api.moveToPrevious renamed to activateNext / activatePrevious: the new names make clear they advance the active panel/group (focus) rather than relocating a panel. The old names still work as deprecated aliases, so no code breaks today; update at your convenience before they are removed in a future major.

Follow Dockview​

If you would like to keep up to date with Dockview consider following us on LinkedIn.