dockview-core 7.0.4 → 8.1.0

package/dist/esm/dockview/popoutWindowService.js

@@ -1,175 +0,0 @@
-import { Emitter } from '../events';
-import { remove } from '../array';
-import { defineModule } from './modules';
-export class PopoutWindowService {
-    constructor(host) {
-        this._entries = [];
-        this._popupServices = new Map();
-        this._restorationCleanups = new Set();
-        this._restorationPromise = Promise.resolve();
-        this._onDidRemove = new Emitter();
-        this.onDidRemove = this._onDidRemove.event;
-        this._host = host;
-    }
-    get entries() {
-        return this._entries;
-    }
-    get restorationPromise() {
-        return this._restorationPromise;
-    }
-    add(entry) {
-        this._entries.push(entry);
-    }
-    remove(entry) {
-        // Fire only on a genuine removal, and not while the host component is
-        // tearing down (consumers don't want popout-removed events during
-        // dispose).
-        if (remove(this._entries, entry) && !this._host.isDisposed) {
-            this._onDidRemove.fire(entry);
-        }
-    }
-    findByGroup(group) {
-        // A popout window may host several groups in a nested gridview, so
-        // match by membership (DOM containment) rather than only the anchor.
-        return this._entries.find((entry) => entry.popoutGroup === group ||
-            entry.gridview.element.contains(group.element));
-    }
-    findReferenceGroupId(group) {
-        var _a;
-        return (_a = this._entries.find((entry) => entry.popoutGroup === group)) === null || _a === void 0 ? void 0 : _a.referenceGroup;
-    }
-    /**
-     * The popout window's innerWidth/innerHeight are often 0/stale until it has
-     * painted, and the nested gridview lays its children out to the size passed
-     * to layout() (a plain group fills via CSS instead). To stop content
-     * rendering into a zero box until a manual resize — and to avoid the race a
-     * fixed number of animation frames had — observe the gridview element with
-     * a ResizeObserver created in the POPOUT window's OWN realm. A parent-realm
-     * observer fires unreliably across the window boundary; a same-realm one
-     * fires reliably, including the initial observation once the window is
-     * sized.
-     *
-     * @returns a disposable that disconnects the observer, or `undefined` when
-     * the popout realm has no ResizeObserver (e.g. jsdom).
-     */
-    observeGridviewSize(popoutWindow, gridview, overlayRenderContainer) {
-        var _a;
-        const PopoutResizeObserver = (_a = popoutWindow.window) === null || _a === void 0 ? void 0 : _a.ResizeObserver;
-        if (!PopoutResizeObserver) {
-            return undefined;
-        }
-        let lastWidth = -1;
-        let lastHeight = -1;
-        const relayout = () => {
-            const win = popoutWindow.window;
-            if (this._host.isDisposed || !win || win.closed) {
-                return;
-            }
-            const width = Math.round(gridview.element.clientWidth);
-            const height = Math.round(gridview.element.clientHeight);
-            if (width === lastWidth && height === lastHeight) {
-                return;
-            }
-            lastWidth = width;
-            lastHeight = height;
-            if (width > 0 && height > 0) {
-                gridview.layout(width, height);
-            }
-            overlayRenderContainer.updateAllPositions();
-        };
-        const observer = new PopoutResizeObserver(() => {
-            var _a;
-            // Defer out of the observer callback into the popout's own frame to
-            // size against the settled layout and to avoid resize-loop warnings.
-            const raf = (_a = popoutWindow.window) === null || _a === void 0 ? void 0 : _a.requestAnimationFrame;
-            if (raf) {
-                raf.call(popoutWindow.window, relayout);
-            }
-            else {
-                relayout();
-            }
-        });
-        observer.observe(gridview.element);
-        return { dispose: () => observer.disconnect() };
-    }
-    getPopupService(groupId) {
-        return this._popupServices.get(groupId);
-    }
-    setPopupService(groupId, service) {
-        this._popupServices.set(groupId, service);
-    }
-    deletePopupService(groupId) {
-        this._popupServices.delete(groupId);
-    }
-    scheduleRestoration(delayMs, work, onCancel) {
-        return new Promise((resolve) => {
-            const cleanup = () => {
-                this._restorationCleanups.delete(cleanup);
-                clearTimeout(handle);
-                onCancel === null || onCancel === void 0 ? void 0 : onCancel();
-                resolve();
-            };
-            const handle = setTimeout(() => {
-                this._restorationCleanups.delete(cleanup);
-                // Guard against the component being disposed before this
-                // timer fires. Under React StrictMode the component is
-                // mounted -> disposed -> remounted, and without this guard
-                // the first instance's queued restoration would open a
-                // second popout window. See issue #851.
-                if (this._host.isDisposed) {
-                    resolve();
-                    return;
-                }
-                work();
-                resolve();
-            }, delayMs);
-            this._restorationCleanups.add(cleanup);
-        });
-    }
-    finishRestoration(promises) {
-        this._restorationPromise = Promise.all(promises).then(() => void 0);
-    }
-    cancelPendingRestorations() {
-        for (const cleanup of [...this._restorationCleanups]) {
-            cleanup();
-        }
-        this._restorationCleanups.clear();
-    }
-    serialize() {
-        return this._entries.map((entry) => {
-            const grid = entry.gridview.serialize();
-            const root = grid.root;
-            const url = entry.popoutGroup.api.location.type === 'popout'
-                ? entry.popoutGroup.api.location.popoutUrl
-                : undefined;
-            const base = {
-                gridReferenceGroup: entry.referenceGroup,
-                position: entry.window.dimensions(),
-                url,
-            };
-            // Single-group window keeps the legacy `data` shape so layouts
-            // round-trip byte-stably and older readers keep working.
-            if (root.type === 'branch' &&
-                root.data.length === 1 &&
-                root.data[0].type === 'leaf') {
-                return Object.assign(Object.assign({}, base), { data: root.data[0].data });
-            }
-            return Object.assign(Object.assign({}, base), { grid });
-        });
-    }
-    disposeAll() {
-        for (const entry of [...this._entries]) {
-            entry.disposable.dispose();
-        }
-    }
-    dispose() {
-        this.cancelPendingRestorations();
-        this.disposeAll();
-        this._onDidRemove.dispose();
-    }
-}
-export const PopoutWindowModule = defineModule({
-    name: 'PopoutWindow',
-    serviceKey: 'popoutWindowService',
-    create: (host) => new PopoutWindowService(host),
-});

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

@@ -1,35 +0,0 @@
-import { IDisposable } from '../lifecycle';
-import { Event } from '../events';
-import { DroptargetEvent, DropTargetTargetModel, Position, WillShowOverlayEvent } from '../dnd/droptarget';
-import { DockviewComponentOptions } from './options';
-export interface IRootDropTargetHost {
-    readonly id: string;
-    readonly element: HTMLElement;
-    readonly options: DockviewComponentOptions;
-    isGridEmpty(): boolean;
-    rootDropTargetOverrideTarget(): DropTargetTargetModel | undefined;
-    /**
-     * Build, fire, and return the verdict for an unhandled-drag-over event.
-     * Implemented on the component side so the service stays free of
-     * circular imports with the event class declared in dockviewComponent.
-     */
-    dispatchUnhandledDragOver(nativeEvent: DragEvent | PointerEvent, position: Position): boolean;
-}
-export interface IRootDropTargetService extends IDisposable {
-    /** Merged stream from both DnD backends. */
-    readonly onWillShowOverlay: Event<WillShowOverlayEvent>;
-    /** Merged stream from both DnD backends. */
-    readonly onDrop: Event<DroptargetEvent>;
-    /** Apply changed options (dndEdges). */
-    setOptions(options: Partial<DockviewComponentOptions>): void;
-}
-export declare class RootDropTargetService implements IRootDropTargetService {
-    private readonly _html5Target;
-    private readonly _pointerTarget;
-    readonly onWillShowOverlay: Event<WillShowOverlayEvent>;
-    readonly onDrop: Event<DroptargetEvent>;
-    constructor(host: IRootDropTargetHost);
-    setOptions(options: Partial<DockviewComponentOptions>): void;
-    dispose(): void;
-}
-export declare const RootDropTargetModule: import("./modules").DockviewModule<IRootDropTargetHost>;

package/dist/esm/dockview/rootDropTargetService.js

@@ -1,82 +0,0 @@
-import { Event } from '../events';
-import { html5Backend, pointerBackend } from '../dnd/backend';
-import { getPanelData } from '../dnd/dataTransfer';
-import { defineModule } from './modules';
-const DEFAULT_ROOT_OVERLAY_MODEL = {
-    activationSize: { type: 'pixels', value: 10 },
-    size: { type: 'pixels', value: 20 },
-};
-export class RootDropTargetService {
-    constructor(host) {
-        const canDisplayOverlay = (event, position) => {
-            const data = getPanelData();
-            if (data) {
-                if (data.viewId !== host.id) {
-                    return false;
-                }
-                if (position === 'center') {
-                    // center drop target only allowed if no panels in primary
-                    // grid; floating panels are allowed
-                    return host.isGridEmpty();
-                }
-                return true;
-            }
-            if (position === 'center' && !host.isGridEmpty()) {
-                // for external events only show the four-corner drag overlays,
-                // disable center so external drag events can fall through to
-                // the group and panel drop target handlers
-                return false;
-            }
-            return host.dispatchUnhandledDragOver(event, position);
-        };
-        const overlayModel = typeof host.options.dndEdges === 'object' &&
-            host.options.dndEdges !== null
-            ? host.options.dndEdges
-            : DEFAULT_ROOT_OVERLAY_MODEL;
-        this._html5Target = html5Backend.createDropTarget(host.element, {
-            className: 'dv-drop-target-edge',
-            canDisplayOverlay,
-            acceptedTargetZones: ['top', 'bottom', 'left', 'right', 'center'],
-            overlayModel,
-            getOverrideTarget: () => host.rootDropTargetOverrideTarget(),
-        });
-        this._pointerTarget = pointerBackend.createDropTarget(host.element, {
-            className: 'dv-drop-target-edge',
-            canDisplayOverlay,
-            acceptedTargetZones: ['top', 'bottom', 'left', 'right', 'center'],
-            overlayModel,
-            getOverrideTarget: () => host.rootDropTargetOverrideTarget(),
-        });
-        this.onWillShowOverlay = Event.any(this._html5Target.onWillShowOverlay, this._pointerTarget.onWillShowOverlay);
-        this.onDrop = Event.any(this._html5Target.onDrop, this._pointerTarget.onDrop);
-        // Apply initial-state options now that the targets exist; setOptions
-        // handles dndEdges (disable + overlay model) and late changes.
-        this.setOptions(host.options);
-    }
-    setOptions(options) {
-        if ('dndEdges' in options) {
-            const disabled = typeof options.dndEdges === 'boolean' &&
-                options.dndEdges === false;
-            this._html5Target.disabled = disabled;
-            this._pointerTarget.disabled = disabled;
-            if (typeof options.dndEdges === 'object' &&
-                options.dndEdges !== null) {
-                this._html5Target.setOverlayModel(options.dndEdges);
-                this._pointerTarget.setOverlayModel(options.dndEdges);
-            }
-            else {
-                this._html5Target.setOverlayModel(DEFAULT_ROOT_OVERLAY_MODEL);
-                this._pointerTarget.setOverlayModel(DEFAULT_ROOT_OVERLAY_MODEL);
-            }
-        }
-    }
-    dispose() {
-        this._html5Target.dispose();
-        this._pointerTarget.dispose();
-    }
-}
-export const RootDropTargetModule = defineModule({
-    name: 'RootDropTarget',
-    serviceKey: 'rootDropTargetService',
-    create: (host) => new RootDropTargetService(host),
-});

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

@@ -1,7 +0,0 @@
-import { CompositeDisposable } from '../lifecycle';
-import { DockviewComponent } from './dockviewComponent';
-export declare class StrictEventsSequencing extends CompositeDisposable {
-    private readonly accessor;
-    constructor(accessor: DockviewComponent);
-    private init;
-}

package/dist/esm/dockview/strictEventsSequencing.js

@@ -1,41 +0,0 @@
-import { CompositeDisposable } from '../lifecycle';
-export class StrictEventsSequencing extends CompositeDisposable {
-    constructor(accessor) {
-        super();
-        this.accessor = accessor;
-        this.init();
-    }
-    init() {
-        const panels = new Set();
-        const groups = new Set();
-        this.addDisposables(this.accessor.onDidAddPanel((panel) => {
-            if (panels.has(panel.api.id)) {
-                throw new Error(`dockview: Invalid event sequence. [onDidAddPanel] called for panel ${panel.api.id} but panel already exists`);
-            }
-            else {
-                panels.add(panel.api.id);
-            }
-        }), this.accessor.onDidRemovePanel((panel) => {
-            if (panels.has(panel.api.id)) {
-                panels.delete(panel.api.id);
-            }
-            else {
-                throw new Error(`dockview: Invalid event sequence. [onDidRemovePanel] called for panel ${panel.api.id} but panel does not exists`);
-            }
-        }), this.accessor.onDidAddGroup((group) => {
-            if (groups.has(group.api.id)) {
-                throw new Error(`dockview: Invalid event sequence. [onDidAddGroup] called for group ${group.api.id} but group already exists`);
-            }
-            else {
-                groups.add(group.api.id);
-            }
-        }), this.accessor.onDidRemoveGroup((group) => {
-            if (groups.has(group.api.id)) {
-                groups.delete(group.api.id);
-            }
-            else {
-                throw new Error(`dockview: Invalid event sequence. [onDidRemoveGroup] called for group ${group.api.id} but group does not exists`);
-            }
-        }));
-    }
-}

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

@@ -1,99 +0,0 @@
-import { Event } from '../events';
-import { CompositeDisposable } from '../lifecycle';
-/**
- * The accent color associated with a tab group.
- *
- * This is any CSS color expression: a palette id (e.g. `'grey'`, `'blue'`),
- * a raw color literal (`'#abc123'`, `'rgb(0,0,0)'`), or `undefined` to inherit
- * the default. Resolution to a concrete CSS value is handled by the
- * dockview's `TabGroupColorPalette` (see `tabGroupAccent.ts`).
- */
-export type DockviewTabGroupColor = string;
-export interface SerializedTabGroup {
-    id: string;
-    label?: string;
-    color?: string;
-    collapsed: boolean;
-    panelIds: string[];
-    componentParams?: Record<string, unknown>;
-}
-export interface TabGroupOptions {
-    label?: string;
-    color?: string;
-    collapsed?: boolean;
-    /**
-     * Free-form data passed to a custom chip renderer
-     * (`createTabGroupChipComponent`). Read via `tabGroup.componentParams`
-     * inside the renderer's `init` / `update`. Must be JSON-serializable to
-     * round-trip through layout serialization.
-     */
-    componentParams?: Record<string, unknown>;
-}
-export interface ITabGroup {
-    readonly id: string;
-    readonly label: string;
-    readonly color: string | undefined;
-    readonly collapsed: boolean;
-    readonly panelIds: readonly string[];
-    readonly size: number;
-    readonly isEmpty: boolean;
-    readonly componentParams: Record<string, unknown> | undefined;
-    readonly onDidChange: Event<void>;
-    readonly onDidPanelChange: Event<{
-        panelId: string;
-        type: 'add' | 'remove';
-    }>;
-    readonly onDidCollapseChange: Event<boolean>;
-    readonly onDidDestroy: Event<void>;
-    addPanel(panelId: string, index?: number): void;
-    removePanel(panelId: string): boolean;
-    indexOfPanel(panelId: string): number;
-    containsPanel(panelId: string): boolean;
-    setLabel(value: string): void;
-    setColor(value: string | undefined): void;
-    setComponentParams(value: Record<string, unknown> | undefined): void;
-    collapse(): void;
-    expand(): void;
-    toggle(): void;
-    toJSON(): SerializedTabGroup;
-    dispose(): void;
-}
-export declare class TabGroup extends CompositeDisposable implements ITabGroup {
-    readonly id: string;
-    private _label;
-    private _color;
-    private _collapsed;
-    private _componentParams;
-    private readonly _panelIds;
-    private readonly _onDidChange;
-    readonly onDidChange: Event<void>;
-    private readonly _onDidPanelChange;
-    readonly onDidPanelChange: Event<{
-        panelId: string;
-        type: "add" | "remove";
-    }>;
-    private readonly _onDidCollapseChange;
-    readonly onDidCollapseChange: Event<boolean>;
-    private readonly _onDidDestroy;
-    readonly onDidDestroy: Event<void>;
-    get label(): string;
-    get color(): string | undefined;
-    get componentParams(): Record<string, unknown> | undefined;
-    setLabel(value: string): void;
-    setColor(value: string | undefined): void;
-    setComponentParams(value: Record<string, unknown> | undefined): void;
-    get collapsed(): boolean;
-    get panelIds(): readonly string[];
-    get size(): number;
-    get isEmpty(): boolean;
-    constructor(id: string, options?: TabGroupOptions);
-    addPanel(panelId: string, index?: number): void;
-    removePanel(panelId: string): boolean;
-    indexOfPanel(panelId: string): number;
-    containsPanel(panelId: string): boolean;
-    collapse(): void;
-    expand(): void;
-    toggle(): void;
-    toJSON(): SerializedTabGroup;
-    dispose(): void;
-}

package/dist/esm/dockview/tabGroup.js

@@ -1,144 +0,0 @@
-import { Emitter } from '../events';
-import { CompositeDisposable } from '../lifecycle';
-export class TabGroup extends CompositeDisposable {
-    get label() {
-        return this._label;
-    }
-    get color() {
-        return this._color;
-    }
-    get componentParams() {
-        return this._componentParams;
-    }
-    setLabel(value) {
-        if (this.isDisposed || this._label === value) {
-            return;
-        }
-        this._label = value;
-        this._onDidChange.fire();
-    }
-    setColor(value) {
-        if (this.isDisposed) {
-            return;
-        }
-        const next = value === '' ? undefined : value;
-        if (this._color === next) {
-            return;
-        }
-        this._color = next;
-        this._onDidChange.fire();
-    }
-    setComponentParams(value) {
-        if (this.isDisposed) {
-            return;
-        }
-        this._componentParams = value;
-        this._onDidChange.fire();
-    }
-    get collapsed() {
-        return this._collapsed;
-    }
-    get panelIds() {
-        return this._panelIds;
-    }
-    get size() {
-        return this._panelIds.length;
-    }
-    get isEmpty() {
-        return this._panelIds.length === 0;
-    }
-    constructor(id, options) {
-        var _a, _b;
-        super();
-        this.id = id;
-        this._collapsed = false;
-        this._panelIds = [];
-        this._onDidChange = new Emitter();
-        this.onDidChange = this._onDidChange.event;
-        this._onDidPanelChange = new Emitter();
-        this.onDidPanelChange = this._onDidPanelChange.event;
-        this._onDidCollapseChange = new Emitter();
-        this.onDidCollapseChange = this._onDidCollapseChange.event;
-        this._onDidDestroy = new Emitter();
-        this.onDidDestroy = this._onDidDestroy.event;
-        this._label = (_a = options === null || options === void 0 ? void 0 : options.label) !== null && _a !== void 0 ? _a : '';
-        this._color = (options === null || options === void 0 ? void 0 : options.color) === '' ? undefined : options === null || options === void 0 ? void 0 : options.color;
-        this._collapsed = (_b = options === null || options === void 0 ? void 0 : options.collapsed) !== null && _b !== void 0 ? _b : false;
-        this._componentParams = options === null || options === void 0 ? void 0 : options.componentParams;
-        this.addDisposables(this._onDidChange, this._onDidPanelChange, this._onDidCollapseChange, this._onDidDestroy);
-    }
-    addPanel(panelId, index) {
-        if (this.isDisposed) {
-            return;
-        }
-        if (this._panelIds.includes(panelId)) {
-            return;
-        }
-        const insertIndex = index === undefined
-            ? this._panelIds.length
-            : Math.max(0, Math.min(index, this._panelIds.length));
-        this._panelIds.splice(insertIndex, 0, panelId);
-        this._onDidPanelChange.fire({ panelId, type: 'add' });
-    }
-    removePanel(panelId) {
-        if (this.isDisposed) {
-            return false;
-        }
-        const index = this._panelIds.indexOf(panelId);
-        if (index === -1) {
-            return false;
-        }
-        this._panelIds.splice(index, 1);
-        this._onDidPanelChange.fire({ panelId, type: 'remove' });
-        return true;
-    }
-    indexOfPanel(panelId) {
-        return this._panelIds.indexOf(panelId);
-    }
-    containsPanel(panelId) {
-        return this._panelIds.includes(panelId);
-    }
-    collapse() {
-        if (this.isDisposed || this._collapsed) {
-            return;
-        }
-        this._collapsed = true;
-        this._onDidCollapseChange.fire(true);
-    }
-    expand() {
-        if (this.isDisposed || !this._collapsed) {
-            return;
-        }
-        this._collapsed = false;
-        this._onDidCollapseChange.fire(false);
-    }
-    toggle() {
-        if (this._collapsed) {
-            this.expand();
-        }
-        else {
-            this.collapse();
-        }
-    }
-    toJSON() {
-        const result = {
-            id: this.id,
-            collapsed: this._collapsed,
-            panelIds: [...this._panelIds],
-        };
-        if (this._label) {
-            result.label = this._label;
-        }
-        if (this._color !== undefined) {
-            result.color = this._color;
-        }
-        if (this._componentParams !== undefined) {
-            result.componentParams = this._componentParams;
-        }
-        return result;
-    }
-    dispose() {
-        this._onDidDestroy.fire();
-        super.dispose();
-    }
-}

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

@@ -1,65 +0,0 @@
-/**
- * A single entry in the tab-group color palette.
- *
- * `id` is the value stored on `ITabGroup.color` and serialized in
- * `SerializedTabGroup.color`. `value` is any CSS color expression — a hex
- * literal, an rgb()/hsl()/oklch() function, or a `var(...)` reference.
- *
- * The default palette ships with `var(--dv-tab-group-color-${id})` values so
- * themes can override the defaults purely in CSS. User-supplied palettes
- * typically use raw color literals.
- */
-export interface DockviewTabGroupColorEntry {
-    id: string;
-    value: string;
-    label?: string;
-}
-export declare const DEFAULT_TAB_GROUP_COLORS: readonly DockviewTabGroupColorEntry[];
-/**
- * Runtime palette for tab-group color accents.
- *
- * Resolves a stored `color` string to a CSS color expression, with three
- * fall-through modes:
- *   1. `id` matches an entry → entry's `value`
- *   2. `id` doesn't match → `id` itself (raw CSS literal pass-through)
- *   3. `id` is empty or undefined → undefined (caller skips assignment)
- *
- * When `enabled` is false the palette returns undefined for everything; this
- * is the `tabGroupAccent: 'off'` opt-out path.
- */
-export declare class TabGroupColorPalette {
-    private _entries;
-    private _byId;
-    private _enabled;
-    constructor(entries: readonly DockviewTabGroupColorEntry[], enabled?: boolean);
-    get enabled(): boolean;
-    set enabled(value: boolean);
-    /**
-     * Replace the entry list in place. Used by `updateOptions` so that
-     * existing palette references (held by chips, indicators, etc.) see
-     * the new palette without needing to be re-wired.
-     */
-    setEntries(entries: readonly DockviewTabGroupColorEntry[]): void;
-    entries(): readonly DockviewTabGroupColorEntry[];
-    has(id: string): boolean;
-    get(id: string): DockviewTabGroupColorEntry | undefined;
-    /** First entry's id; used as the default when a color is unset. */
-    defaultId(): string | undefined;
-    /**
-     * Resolve a stored color to its CSS value, or undefined if no value
-     * should be written (palette disabled, or color empty/undefined).
-     */
-    resolveValue(color: string | undefined): string | undefined;
-}
-/**
- * Set the `--dv-tab-group-color` custom property on `el` to the resolved
- * accent value, or remove it when the palette is disabled / color is unset.
- */
-export declare function applyTabGroupAccent(el: HTMLElement, color: string | undefined, palette: TabGroupColorPalette | undefined): void;
-/**
- * Return the resolved CSS color for a tab group, or undefined when the
- * palette is disabled or no color is set. Use this when you need the raw
- * value to assign to a non-custom-property style (e.g. SVG stroke,
- * backgroundColor on the indicator underline).
- */
-export declare function resolveTabGroupAccent(color: string | undefined, palette: TabGroupColorPalette | undefined): string | undefined;