dockview-core 6.6.1 → 7.0.3

package/dist/esm/dockview/dockviewShell.js

@@ -1,18 +1,32 @@
 import { Emitter } from '../events';
 import { CompositeDisposable } from '../lifecycle';
 import { LayoutPriority, Orientation, Splitview, } from '../splitview/splitview';
-import { watchElementResize } from '../dom';
+import { isInDocument, watchElementResize } from '../dom';
 export class EdgeGroupView {
+    /**
+     * The effective (pre-gap) collapsed size: the measured tab-strip size when
+     * available, otherwise the configured/theme base.
+     */
+    get _effectiveBaseCollapsed() {
+        var _a;
+        return (_a = this._measuredTabSize) !== null && _a !== void 0 ? _a : this._baseCollapsedSize;
+    }
     get minimumSize() {
         // When collapsed, lock size to collapsedSize so sash can't drag it open
-        return this._isCollapsed
-            ? this._collapsedSize
-            : this._expandedMinimumSize;
+        if (this._isCollapsed) {
+            return this.collapsedSize;
+        }
+        // If the caller explicitly provides a minimumSize, respect it.
+        // Otherwise fall back to collapsedSize + 50 so the expanded state is
+        // visually distinguishable from the collapsed state.
+        return this._baseMinimumSize !== undefined
+            ? this._baseMinimumSize + this._gapAdd
+            : this._effectiveBaseCollapsed + 50 + this._gapAdd;
     }
     get maximumSize() {
         // When collapsed, lock size to collapsedSize so sash can't drag it open
         return this._isCollapsed
-            ? this._collapsedSize
+            ? this.collapsedSize
             : this._expandedMaximumSize;
     }
     get element() {
@@ -25,34 +39,62 @@ export class EdgeGroupView {
         return this._lastExpandedSize;
     }
     get collapsedSize() {
-        return this._collapsedSize;
+        return this._effectiveBaseCollapsed + this._gapAdd;
     }
-    constructor(options, group, orientation) {
+    constructor(options, group, orientation, gapAdd = 0) {
         var _a, _b, _c;
         this._onDidChange = new Emitter();
         this.onDidChange = this._onDidChange.event;
         this.snap = false;
         this.priority = LayoutPriority.Low;
         this._isCollapsed = false;
+        this._tabSizeDisposables = new CompositeDisposable();
         this._group = group;
         this._orientation = orientation;
         group.element.classList.add('dv-edge-group');
         group.element.dataset.testid = `dv-edge-group-${options.id}`;
-        this._collapsedSize = (_a = options.collapsedSize) !== null && _a !== void 0 ? _a : 35;
+        this._baseCollapsedSize = (_a = options.collapsedSize) !== null && _a !== void 0 ? _a : 35;
+        this._baseMinimumSize = options.minimumSize;
+        this._gapAdd = gapAdd;
         this._expandedMaximumSize =
             (_b = options.maximumSize) !== null && _b !== void 0 ? _b : Number.POSITIVE_INFINITY;
-        // If the caller explicitly provides a minimumSize, respect it.
-        // Otherwise fall back to collapsedSize + 50 so the expanded state is
-        // visually distinguishable from the collapsed state.
-        this._expandedMinimumSize =
-            options.minimumSize !== undefined
-                ? options.minimumSize
-                : this._collapsedSize + 50;
         this._lastExpandedSize = (_c = options.initialSize) !== null && _c !== void 0 ? _c : 200;
         if (options.collapsed) {
             this._isCollapsed = true;
             group.element.classList.add('dv-edge-collapsed');
         }
+        this._observeTabStrip();
+    }
+    /**
+     * Watch the group's tab strip so the collapsed size follows the live tab
+     * height. The strip's cross-axis size (height for top/bottom, width for
+     * left/right) is exactly what a collapsed edge group should occupy; a
+     * ResizeObserver keeps them in sync when the tab height changes at runtime.
+     */
+    _observeTabStrip() {
+        const strip = this._group.element.querySelector('.dv-tabs-and-actions-container');
+        if (!strip) {
+            return;
+        }
+        this._tabSizeDisposables.addDisposables(watchElementResize(strip, () => {
+            this._applyMeasuredTabSize(this._orientation === 'vertical'
+                ? strip.offsetHeight
+                : strip.offsetWidth);
+        }));
+    }
+    /**
+     * Apply a freshly-measured tab-strip cross size. When the group is
+     * collapsed this resizes it in the parent splitview so the collapsed strip
+     * always shows the full tab height.
+     */
+    _applyMeasuredTabSize(size) {
+        if (size <= 0 || size === this._measuredTabSize) {
+            return;
+        }
+        this._measuredTabSize = size;
+        if (this._isCollapsed) {
+            this._onDidChange.fire({ size: this.collapsedSize });
+        }
     }
     layout(size, orthogonalSize) {
         // Track the last expanded size so we can restore it after collapsing
@@ -88,15 +130,18 @@ export class EdgeGroupView {
         this._lastExpandedSize = size;
     }
     /**
-     * Apply new effective collapsed and expanded-minimum sizes after a theme
-     * or gap change. The caller (ShellManager) is responsible for computing
-     * the correct values from the original config and the new gap.
+     * Apply a new base (pre-gap) collapsed size, base minimum size and gap
+     * contribution after a theme or gap change. Base values come from the
+     * original config; the ShellManager owns the gap arithmetic. A live
+     * measured tab size (if any) continues to win over the base collapsed size.
      */
-    updateCollapsedSize(newCollapsedSize, newExpandedMinimumSize) {
-        this._collapsedSize = newCollapsedSize;
-        this._expandedMinimumSize = newExpandedMinimumSize;
+    updateSizing(baseCollapsedSize, baseMinimumSize, gapAdd) {
+        this._baseCollapsedSize = baseCollapsedSize;
+        this._baseMinimumSize = baseMinimumSize;
+        this._gapAdd = gapAdd;
     }
     dispose() {
+        this._tabSizeDisposables.dispose();
         this._onDidChange.dispose();
     }
 }
@@ -228,15 +273,6 @@ class MiddleColumnView {
         this._splitview.dispose();
     }
 }
-function adjustedOpts(base, defaultCollapsed, gapAdd) {
-    var _a;
-    const effectiveCollapsed = ((_a = base.collapsedSize) !== null && _a !== void 0 ? _a : defaultCollapsed) + gapAdd;
-    const result = Object.assign(Object.assign({}, base), { collapsedSize: effectiveCollapsed });
-    if (base.minimumSize !== undefined) {
-        result.minimumSize = base.minimumSize + gapAdd;
-    }
-    return result;
-}
 export class ShellManager {
     constructor(container, dockviewElement, layoutGrid, gap = 0, defaultCollapsedSize = 35) {
         this._disposables = new CompositeDisposable();
@@ -262,6 +298,26 @@ export class ShellManager {
         this._middleIndex = 0;
         this._outerSplitview.addView(this._middleColumn, { type: 'distribute' }, 0);
         this._disposables.addDisposables(watchElementResize(this._shellElement, (entry) => {
+            /**
+             * When the shell (or an ancestor) becomes hidden — e.g. a
+             * nested dockview whose `onlyWhenVisible` host panel is
+             * deactivated — the element collapses to (0, 0) or is detached
+             * from the DOM. Propagating that zero size would relayout the
+             * edge-group splitview at 0, clamping the low-priority edge
+             * groups down to their minimum size and destroying the user's
+             * sizing. Skip these cases so sizes are preserved while hidden;
+             * mirrors the guard in the `Resizable` base class. See #1495.
+             *
+             * offsetParent === null is equivalent to display: none on the
+             * element or one of its ancestors.
+             * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent
+             */
+            if (!this._shellElement.offsetParent) {
+                return;
+            }
+            if (!isInDocument(this._shellElement)) {
+                return;
+            }
             const width = Math.round(entry.contentRect.width);
             const height = Math.round(entry.contentRect.height);
             if (width === this._currentWidth &&
@@ -298,7 +354,7 @@ export class ShellManager {
         const isHorizontal = position === 'left' || position === 'right';
         const gapAdd = isHorizontal ? outerGapAdd : innerGapAdd;
         const orientation = isHorizontal ? 'horizontal' : 'vertical';
-        const view = new EdgeGroupView(adjustedOpts(Object.assign({ collapsedSize: this._defaultCollapsedSize }, options), this._defaultCollapsedSize, gapAdd), group, orientation);
+        const view = new EdgeGroupView(Object.assign({ collapsedSize: this._defaultCollapsedSize }, options), group, orientation, gapAdd);
         const initialSize = view.isCollapsed
             ? view.collapsedSize
             : view.lastExpandedSize;
@@ -365,10 +421,7 @@ export class ShellManager {
         const updateView = (view, baseCfg, gapAdd) => {
             var _a;
             const baseCS = (_a = baseCfg.collapsedSize) !== null && _a !== void 0 ? _a : defaultCollapsedSize;
-            const newCS = baseCS + gapAdd;
-            const baseMS = baseCfg.minimumSize;
-            const newMS = baseMS !== undefined ? baseMS + gapAdd : newCS + 50;
-            view.updateCollapsedSize(newCS, newMS);
+            view.updateSizing(baseCS, baseCfg.minimumSize, gapAdd);
         };
         const topCfg = this._viewConfigs.get('top');
         if (this._topView && topCfg) {
@@ -619,8 +672,7 @@ export class ShellManager {
         }
     }
     dispose() {
-        var _a;
         this._disposables.dispose();
-        (_a = this._shellElement.parentElement) === null || _a === void 0 ? void 0 : _a.removeChild(this._shellElement);
+        this._shellElement.remove();
     }
 }

package/dist/esm/dockview/edgeGroupService.d.ts

@@ -0,0 +1,38 @@
+import { IDisposable } from '../lifecycle';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
+import { EdgeGroupPosition } from './dockviewShell';
+/**
+ * EdgeGroupService is a pure registry: it tracks which positions are
+ * occupied and owns each edge group's per-instance cleanup disposable.
+ *
+ * The ShellManager (layout infrastructure) and the addEdgeGroup
+ * orchestration remain on DockviewComponent.
+ */
+export interface IEdgeGroupServiceHost {
+}
+export interface IEdgeGroupService extends IDisposable {
+    add(position: EdgeGroupPosition, group: DockviewGroupPanel, autoCollapseDisposable: IDisposable): void;
+    remove(position: EdgeGroupPosition): void;
+    get(position: EdgeGroupPosition): DockviewGroupPanel | undefined;
+    has(position: EdgeGroupPosition): boolean;
+    hasAny(): boolean;
+    entries(): IterableIterator<[EdgeGroupPosition, DockviewGroupPanel]>;
+    includes(group: DockviewGroupPanel): boolean;
+    findPositionOf(group: DockviewGroupPanel): EdgeGroupPosition | undefined;
+    disposeAll(): void;
+}
+export declare class EdgeGroupService implements IEdgeGroupService {
+    private readonly _edgeGroups;
+    private readonly _edgeGroupDisposables;
+    add(position: EdgeGroupPosition, group: DockviewGroupPanel, autoCollapseDisposable: IDisposable): void;
+    remove(position: EdgeGroupPosition): void;
+    get(position: EdgeGroupPosition): DockviewGroupPanel | undefined;
+    has(position: EdgeGroupPosition): boolean;
+    hasAny(): boolean;
+    entries(): IterableIterator<[EdgeGroupPosition, DockviewGroupPanel]>;
+    includes(group: DockviewGroupPanel): boolean;
+    findPositionOf(group: DockviewGroupPanel): EdgeGroupPosition | undefined;
+    disposeAll(): void;
+    dispose(): void;
+}
+export declare const EdgeGroupModule: import("./modules").DockviewModule<IEdgeGroupServiceHost>;

package/dist/esm/dockview/edgeGroupService.js

@@ -0,0 +1,63 @@
+import { defineModule } from './modules';
+export class EdgeGroupService {
+    constructor() {
+        this._edgeGroups = new Map();
+        this._edgeGroupDisposables = new Map();
+    }
+    // No constructor needed — the host is currently unused. The
+    // IEdgeGroupServiceHost slot stays for symmetry with the other modules
+    // and to leave room for future host callbacks.
+    add(position, group, autoCollapseDisposable) {
+        this._edgeGroups.set(position, group);
+        this._edgeGroupDisposables.set(position, autoCollapseDisposable);
+    }
+    remove(position) {
+        var _a;
+        (_a = this._edgeGroupDisposables.get(position)) === null || _a === void 0 ? void 0 : _a.dispose();
+        this._edgeGroupDisposables.delete(position);
+        this._edgeGroups.delete(position);
+    }
+    get(position) {
+        return this._edgeGroups.get(position);
+    }
+    has(position) {
+        return this._edgeGroups.has(position);
+    }
+    hasAny() {
+        return this._edgeGroups.size > 0;
+    }
+    entries() {
+        return this._edgeGroups.entries();
+    }
+    includes(group) {
+        for (const edgeGroup of this._edgeGroups.values()) {
+            if (edgeGroup === group) {
+                return true;
+            }
+        }
+        return false;
+    }
+    findPositionOf(group) {
+        for (const [position, edgeGroup] of this._edgeGroups) {
+            if (edgeGroup === group) {
+                return position;
+            }
+        }
+        return undefined;
+    }
+    disposeAll() {
+        for (const disposable of this._edgeGroupDisposables.values()) {
+            disposable.dispose();
+        }
+        this._edgeGroupDisposables.clear();
+        this._edgeGroups.clear();
+    }
+    dispose() {
+        this.disposeAll();
+    }
+}
+export const EdgeGroupModule = defineModule({
+    name: 'EdgeGroup',
+    serviceKey: 'edgeGroupService',
+    create: () => new EdgeGroupService(),
+});

package/dist/esm/dockview/floatingGroupService.d.ts

@@ -0,0 +1,37 @@
+import { IDisposable } from '../lifecycle';
+import { Gridview } from '../gridview/gridview';
+import { Overlay } from '../overlay/overlay';
+import { DockviewFloatingGroupPanel } from './dockviewFloatingGroupPanel';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
+import { DockviewOptions } from './options';
+import { SerializedFloatingGroup } from './dockviewComponent';
+/**
+ * Narrow callback surface the FloatingGroupService needs from its host
+ * component. Keeps the service decoupled from DockviewComponent.
+ */
+export interface IFloatingGroupHost {
+    fireLayoutChange(): void;
+}
+export interface IFloatingGroupService extends IDisposable {
+    readonly floatingGroups: readonly DockviewFloatingGroupPanel[];
+    add(group: DockviewGroupPanel, overlay: Overlay, gridview: Gridview): DockviewFloatingGroupPanel;
+    findByGroup(group: DockviewGroupPanel): DockviewFloatingGroupPanel | undefined;
+    serialize(): SerializedFloatingGroup[];
+    constrainBounds(): void;
+    updateBounds(options: Partial<DockviewOptions>): void;
+    disposeAll(): void;
+}
+export declare class FloatingGroupService implements IFloatingGroupService {
+    private readonly _host;
+    private readonly _floatingGroups;
+    get floatingGroups(): readonly DockviewFloatingGroupPanel[];
+    constructor(host: IFloatingGroupHost);
+    add(group: DockviewGroupPanel, overlay: Overlay, gridview: Gridview): DockviewFloatingGroupPanel;
+    findByGroup(group: DockviewGroupPanel): DockviewFloatingGroupPanel | undefined;
+    serialize(): SerializedFloatingGroup[];
+    constrainBounds(): void;
+    updateBounds(options: Partial<DockviewOptions>): void;
+    disposeAll(): void;
+    dispose(): void;
+}
+export declare const FloatingGroupModule: import("./modules").DockviewModule<IFloatingGroupHost>;

package/dist/esm/dockview/floatingGroupService.js

@@ -0,0 +1,150 @@
+import { CompositeDisposable } from '../lifecycle';
+import { remove } from '../array';
+import { watchElementResize } from '../dom';
+import { DEFAULT_FLOATING_GROUP_OVERFLOW_SIZE } from '../constants';
+import { DockviewFloatingGroupPanel } from './dockviewFloatingGroupPanel';
+import { defineModule } from './modules';
+export class FloatingGroupService {
+    get floatingGroups() {
+        return this._floatingGroups;
+    }
+    constructor(host) {
+        this._floatingGroups = [];
+        this._host = host;
+    }
+    add(group, overlay, gridview) {
+        const floatingGroupPanel = new DockviewFloatingGroupPanel(group, overlay, gridview);
+        const disposable = new CompositeDisposable(group.api.onDidActiveChange((event) => {
+            if (event.isActive) {
+                overlay.bringToFront();
+            }
+        }), (() => {
+            // The floating window's nested gridview fills the overlay
+            // beneath the (optional) title bar; size it from its own
+            // measured box so it follows the overlay as the user drags
+            // / resizes the window.
+            let lastWidth = -1;
+            let lastHeight = -1;
+            return watchElementResize(gridview.element, (entry) => {
+                const width = Math.round(entry.contentRect.width);
+                const height = Math.round(entry.contentRect.height);
+                if (width === lastWidth && height === lastHeight) {
+                    return;
+                }
+                lastWidth = width;
+                lastHeight = height;
+                gridview.layout(width, height);
+            });
+        })());
+        // Floating windows are non-modal dialogs (role set in Overlay). Give
+        // the dialog an accessible name from the representative group's active
+        // panel, refreshed as the active panel changes. An untitled panel
+        // leaves the dialog unnamed rather than hard-coding a label string.
+        const updateDialogLabel = () => {
+            var _a;
+            const title = (_a = group.activePanel) === null || _a === void 0 ? void 0 : _a.title;
+            if (title) {
+                overlay.element.setAttribute('aria-label', title);
+            }
+            else {
+                overlay.element.removeAttribute('aria-label');
+            }
+        };
+        updateDialogLabel();
+        floatingGroupPanel.addDisposables(group.api.onDidActivePanelChange(() => updateDialogLabel()), overlay.onDidChange(() => {
+            gridview.layout(gridview.width, gridview.height);
+        }), overlay.onDidChangeEnd(() => {
+            this._host.fireLayoutChange();
+        }), group.onDidChange((event) => {
+            // `event.height` is the group's requested *content* height.
+            // When a dedicated title bar is present the overlay's outer
+            // box is taller by the header, so add it back to preserve the
+            // requested content size.
+            overlay.setBounds({
+                height: typeof (event === null || event === void 0 ? void 0 : event.height) === 'number'
+                    ? event.height + overlay.headerHeight
+                    : event === null || event === void 0 ? void 0 : event.height,
+                width: event === null || event === void 0 ? void 0 : event.width,
+            });
+        }), {
+            dispose: () => {
+                disposable.dispose();
+                remove(this._floatingGroups, floatingGroupPanel);
+                group.model.location = { type: 'grid' };
+            },
+        });
+        this._floatingGroups.push(floatingGroupPanel);
+        return floatingGroupPanel;
+    }
+    findByGroup(group) {
+        // A floating window may host several groups in a nested gridview, so
+        // match by membership (DOM containment) rather than only the anchor
+        // group. `floating.group === group` covers the brief window before the
+        // anchor's element is attached to the gridview.
+        return this._floatingGroups.find((floating) => floating.group === group ||
+            floating.gridview.element.contains(group.element));
+    }
+    serialize() {
+        return this._floatingGroups.map((floating) => {
+            const grid = floating.gridview.serialize();
+            const position = floating.overlay.toJSON();
+            const root = grid.root;
+            // A single-group window keeps the legacy `data` shape so layouts
+            // round-trip byte-stably and older readers keep working; only
+            // genuine multi-group windows emit the nested `grid` form.
+            if (root.type === 'branch' &&
+                root.data.length === 1 &&
+                root.data[0].type === 'leaf') {
+                return {
+                    data: root.data[0].data,
+                    position,
+                };
+            }
+            return { grid, position };
+        });
+    }
+    constrainBounds() {
+        for (const floating of this._floatingGroups) {
+            floating.overlay.setBounds();
+        }
+    }
+    updateBounds(options) {
+        var _a, _b;
+        if (!('floatingGroupBounds' in options)) {
+            return;
+        }
+        for (const group of this._floatingGroups) {
+            switch (options.floatingGroupBounds) {
+                case 'boundedWithinViewport':
+                    group.overlay.minimumInViewportHeight = undefined;
+                    group.overlay.minimumInViewportWidth = undefined;
+                    break;
+                case undefined:
+                    group.overlay.minimumInViewportHeight =
+                        DEFAULT_FLOATING_GROUP_OVERFLOW_SIZE;
+                    group.overlay.minimumInViewportWidth =
+                        DEFAULT_FLOATING_GROUP_OVERFLOW_SIZE;
+                    break;
+                default:
+                    group.overlay.minimumInViewportHeight =
+                        (_a = options.floatingGroupBounds) === null || _a === void 0 ? void 0 : _a.minimumHeightWithinViewport;
+                    group.overlay.minimumInViewportWidth =
+                        (_b = options.floatingGroupBounds) === null || _b === void 0 ? void 0 : _b.minimumWidthWithinViewport;
+            }
+            group.overlay.setBounds();
+        }
+    }
+    disposeAll() {
+        for (const floating of [...this._floatingGroups]) {
+            floating.dispose();
+        }
+    }
+    dispose() {
+        this.disposeAll();
+    }
+}
+export const FloatingGroupModule = defineModule({
+    name: 'FloatingGroup',
+    serviceKey: 'floatingGroupService',
+    create: (host) => new FloatingGroupService(host),
+});

package/dist/esm/dockview/headerActionsService.d.ts

@@ -0,0 +1,32 @@
+import { IDisposable } from '../lifecycle';
+import { Event } from '../events';
+import { DockviewComponentOptions } from './options';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
+import { DockviewApi } from '../api/component.api';
+export interface IHeaderActionsHost {
+    readonly api: DockviewApi;
+    readonly options: DockviewComponentOptions;
+    readonly groups: DockviewGroupPanel[];
+    readonly onDidAddGroup: Event<DockviewGroupPanel>;
+    readonly onDidRemoveGroup: Event<DockviewGroupPanel>;
+}
+export interface IHeaderActionsService extends IDisposable {
+    /** Re-mount the three header action slots on a single group. */
+    refresh(group: DockviewGroupPanel): void;
+    /** Re-mount on every group; used when one of the three options changes. */
+    refreshAll(): void;
+    /** Tear down per-group renderer state. */
+    disposeGroup(group: DockviewGroupPanel): void;
+}
+export declare class HeaderActionsService implements IHeaderActionsService {
+    private readonly _host;
+    private readonly _perGroup;
+    constructor(host: IHeaderActionsHost);
+    refresh(group: DockviewGroupPanel): void;
+    refreshAll(): void;
+    disposeGroup(group: DockviewGroupPanel): void;
+    dispose(): void;
+    private _ensureState;
+    private _refreshSlot;
+}
+export declare const HeaderActionsModule: import("./modules").DockviewModule<IHeaderActionsHost>;

package/dist/esm/dockview/headerActionsService.js

@@ -0,0 +1,86 @@
+import { CompositeDisposable, MutableDisposable, } from '../lifecycle';
+import { defineModule } from './modules';
+const SLOT_OPTION_KEY = {
+    left: 'createLeftHeaderActionComponent',
+    right: 'createRightHeaderActionComponent',
+    prefix: 'createPrefixHeaderActionComponent',
+};
+export class HeaderActionsService {
+    constructor(host) {
+        this._perGroup = new Map();
+        this._host = host;
+    }
+    refresh(group) {
+        // The headerPosition setter on DockviewGroupPanelModel fires inside
+        // the model's constructor — before the parent DockviewGroupPanel has
+        // assigned its `_model` field, and in tests where the parent panel
+        // may be null. Skip; DockviewGroupPanel.initialize() will refresh
+        // once construction completes for real groups.
+        if (!(group === null || group === void 0 ? void 0 : group.model)) {
+            return;
+        }
+        const state = this._ensureState(group);
+        this._refreshSlot('left', group, state.left);
+        this._refreshSlot('right', group, state.right);
+        this._refreshSlot('prefix', group, state.prefix);
+    }
+    refreshAll() {
+        for (const group of this._host.groups) {
+            this.refresh(group);
+        }
+    }
+    disposeGroup(group) {
+        const state = this._perGroup.get(group);
+        if (!state) {
+            return;
+        }
+        state.left.dispose();
+        state.right.dispose();
+        state.prefix.dispose();
+        this._perGroup.delete(group);
+    }
+    dispose() {
+        for (const group of [...this._perGroup.keys()]) {
+            this.disposeGroup(group);
+        }
+    }
+    _ensureState(group) {
+        let state = this._perGroup.get(group);
+        if (!state) {
+            state = {
+                left: new MutableDisposable(),
+                right: new MutableDisposable(),
+                prefix: new MutableDisposable(),
+            };
+            this._perGroup.set(group, state);
+        }
+        return state;
+    }
+    _refreshSlot(slot, group, disposable) {
+        const factory = this._host.options[SLOT_OPTION_KEY[slot]];
+        if (factory) {
+            const renderer = factory(group);
+            disposable.value = renderer;
+            renderer.init({
+                containerApi: this._host.api,
+                api: group.api,
+                group,
+            });
+            group.model.attachHeaderAction(slot, renderer.element);
+        }
+        else {
+            disposable.dispose();
+            group.model.attachHeaderAction(slot, undefined);
+        }
+    }
+}
+export const HeaderActionsModule = defineModule({
+    name: 'HeaderActions',
+    serviceKey: 'headerActionsService',
+    create: (host) => new HeaderActionsService(host),
+    init: (host, service) => {
+        return new CompositeDisposable(host.onDidRemoveGroup((group) => {
+            service.disposeGroup(group);
+        }));
+    },
+});

package/dist/esm/dockview/liveRegionService.d.ts

@@ -0,0 +1,53 @@
+import { CompositeDisposable, IDisposable } from '../lifecycle';
+import { Event } from '../events';
+import { IDockviewPanel } from './dockviewPanel';
+import { DockviewGroupPanel } from './dockviewGroupPanel';
+import { DockviewLayoutMutationEvent, DockviewMaximizedGroupChangeEvent } from './dockviewComponent';
+import { DockviewComponentOptions } from './options';
+/**
+ * The narrow surface the {@link LiveRegionService} needs from the host
+ * (the `DockviewComponent`) — somewhere to mount the region and the layout
+ * events to narrate. `onWill/onDidMutateLayout` are used to suppress the
+ * bulk-load / clear burst (one transaction, not N panel announcements).
+ */
+export interface ILiveRegionHost {
+    readonly element: HTMLElement;
+    readonly options: DockviewComponentOptions;
+    readonly onDidAddPanel: Event<IDockviewPanel>;
+    readonly onDidRemovePanel: Event<IDockviewPanel>;
+    readonly onWillMutateLayout: Event<DockviewLayoutMutationEvent>;
+    readonly onDidMutateLayout: Event<DockviewLayoutMutationEvent>;
+    readonly onDidMaximizedGroupChange: Event<DockviewMaximizedGroupChangeEvent>;
+    readonly onDidAddGroup: Event<DockviewGroupPanel>;
+    readonly onDidRemoveGroup: Event<DockviewGroupPanel>;
+}
+export interface ILiveRegionService extends IDisposable {
+    /**
+     * Announce a message to assistive technology via the live region. The
+     * shared sink — the accessibility module writes keyboard-docking
+     * narration here too, so all announcements use one region.
+     */
+    announce(message: string, politeness?: 'polite' | 'assertive'): void;
+}
+/**
+ * Narrates layout state changes to screen readers via visually-hidden
+ * `aria-live` regions. Free / core (WCAG 4.1.3). Announces panel open/close +
+ * the shared `announce()` sink (the accessibility module narrates docking here too).
+ * Two regions: a **polite** one for routine status and an **assertive** one
+ * for errors/cancellations. The bulk load/clear burst is suppressed via the
+ * mutation-transaction events, and an app can take over delivery entirely with
+ * the `announcer` option.
+ */
+export declare class LiveRegionService extends CompositeDisposable implements ILiveRegionService {
+    private readonly _host;
+    private readonly _polite;
+    private readonly _assertive;
+    private _suppressDepth;
+    private readonly _locationSubs;
+    constructor(host: ILiveRegionHost);
+    private _trackLocation;
+    announce(message: string, politeness?: 'polite' | 'assertive'): void;
+    private _announce;
+    private _defaultMessage;
+}
+export declare const LiveRegionModule: import("./modules").DockviewModule<ILiveRegionHost>;