dockview/dist/esm/dockview/dockviewGroupPanel.js

Zero dependency layout manager supporting tabs, grids and splitviews with ReactJS support

import { GroupChangeKind2 } from '../groupview/groupview';
import { DockviewPanelApiImpl } from '../api/groupPanelApi';
import { CompositeDisposable, MutableDisposable } from '../lifecycle';
export class DockviewGroupPanel extends CompositeDisposable {
    constructor(id, containerApi) {
        super();
        this.id = id;
        this.containerApi = containerApi;
        this.mutableDisposable = new MutableDisposable();
        this._suppressClosable = false;
        this._title = '';
        this.api = new DockviewPanelApiImpl(this, this._group);
        this.onDidStateChange = this.api.onDidStateChange;
        this.addDisposables(this.api.onActiveChange(() => {
            this.containerApi.setActivePanel(this);
        }), this.api.onDidTitleChange((event) => {
            const title = event.title;
            this.update({ params: { title } });
        }));
    }
    get title() {
        return this._title;
    }
    get suppressClosable() {
        return this._suppressClosable;
    }
    get group() {
        return this._group;
    }
    get view() {
        return this._view;
    }
    init(params) {
        var _a;
        this._params = params.params;
        this._view = params.view;
        this.setTitle(params.title);
        this.setSuppressClosable(params.suppressClosable || false);
        if (params.state) {
            this.api.setState(params.state);
        }
        (_a = this.view) === null || _a === void 0 ? void 0 : _a.init(Object.assign(Object.assign({}, params), { api: this.api, containerApi: this.containerApi }));
    }
    focus() {
        this.api._onFocusEvent.fire();
    }
    setDirty(isDirty) {
        this.api._onDidDirtyChange.fire(isDirty);
    }
    close() {
        if (this.api.tryClose) {
            return this.api.tryClose();
        }
        return Promise.resolve(true);
    }
    toJSON() {
        const state = this.api.getState();
        return {
            id: this.id,
            view: this.view.toJSON(),
            params: Object.keys(this._params || {}).length > 0
                ? this._params
                : undefined,
            state: state && Object.keys(state).length > 0 ? state : undefined,
            suppressClosable: this.suppressClosable || undefined,
            title: this.title,
        };
    }
    setTitle(title) {
        var _a;
        const didTitleChange = title !== ((_a = this._params) === null || _a === void 0 ? void 0 : _a.title);
        if (didTitleChange) {
            this._title = title;
            this.api._titleChanged.fire({ title: this.title });
        }
    }
    setSuppressClosable(suppressClosable) {
        var _a;
        const didSuppressChangableClose = suppressClosable !== ((_a = this._params) === null || _a === void 0 ? void 0 : _a.suppressClosable);
        if (didSuppressChangableClose) {
            this._suppressClosable = suppressClosable;
            this.api._suppressClosableChanged.fire({
                suppressClosable: !!this.suppressClosable,
            });
        }
    }
    update(event) {
        var _a;
        const params = event.params;
        this._params = Object.assign(Object.assign({}, (this._params || {})), event.params.params);
        if (typeof params.title === 'string') {
            this.setTitle(params.title);
        }
        if (typeof params.suppressClosable === 'boolean') {
            this.setSuppressClosable(params.suppressClosable);
        }
        (_a = this.view) === null || _a === void 0 ? void 0 : _a.update({
            params: {
                params: this._params,
                title: this.title,
                suppressClosable: this.suppressClosable,
            },
        });
    }
    updateParentGroup(group, isGroupActive) {
        var _a;
        this._group = group;
        this.api.group = group;
        this.mutableDisposable.value = this._group.model.onDidGroupChange((ev) => {
            var _a;
            if (ev.kind === GroupChangeKind2.GROUP_ACTIVE) {
                const isVisible = !!((_a = this._group) === null || _a === void 0 ? void 0 : _a.model.isPanelActive(this));
                this.api._onDidActiveChange.fire({
                    isActive: isGroupActive && isVisible,
                });
                this.api._onDidVisibilityChange.fire({
                    isVisible,
                });
            }
        });
        const isPanelVisible = this._group.model.isPanelActive(this);
        this.api._onDidActiveChange.fire({
            isActive: isGroupActive && isPanelVisible,
        });
        this.api._onDidVisibilityChange.fire({
            isVisible: isPanelVisible,
        });
        (_a = this.view) === null || _a === void 0 ? void 0 : _a.updateParentGroup(this._group, this._group.model.isPanelActive(this));
    }
    layout(width, height) {
        var _a, _b;
        // the obtain the correct dimensions of the content panel we must deduct the tab height
        this.api._onDidPanelDimensionChange.fire({
            width,
            height: height - (((_a = this.group) === null || _a === void 0 ? void 0 : _a.model.tabHeight) || 0),
        });
        (_b = this.view) === null || _b === void 0 ? void 0 : _b.layout(width, height);
    }
    dispose() {
        var _a;
        this.api.dispose();
        this.mutableDisposable.dispose();
        (_a = this.view) === null || _a === void 0 ? void 0 : _a.dispose();
    }
}