dockview-core 7.0.4 → 8.1.0

package/dist/esm/gridview/baseComponentGridview.d.ts

@@ -1,111 +0,0 @@
-import { Event, AsapEvent } from '../events';
-import { Gridview, IGridView } from './gridview';
-import { Position } from '../dnd/droptarget';
-import { IDisposable, IValueDisposable } from '../lifecycle';
-import { ISplitviewStyles, Orientation } from '../splitview/splitview';
-import { IPanel } from '../panel/types';
-import { MovementOptions2 } from '../dockview/options';
-import { Resizable } from '../resizable';
-/**
- * A direction in which a panel can be moved or placed relative to another panel.
- */
-export type Direction = 'left' | 'right' | 'above' | 'below' | 'within';
-export declare function toTarget(direction: Direction): Position;
-export interface MaximizedChanged<T extends IGridPanelView> {
-    panel: T;
-    isMaximized: boolean;
-}
-export interface BaseGridOptions {
-    readonly proportionalLayout: boolean;
-    readonly orientation: Orientation;
-    readonly styles?: ISplitviewStyles;
-    readonly disableAutoResizing?: boolean;
-    readonly locked?: boolean;
-    readonly margin?: number;
-    readonly className?: string;
-}
-export interface IGridPanelView extends IGridView, IPanel {
-    setActive(isActive: boolean): void;
-    readonly isActive: boolean;
-}
-export interface IBaseGrid<T extends IGridPanelView> extends IDisposable {
-    readonly element: HTMLElement;
-    readonly id: string;
-    readonly width: number;
-    readonly height: number;
-    readonly minimumHeight: number;
-    readonly maximumHeight: number;
-    readonly minimumWidth: number;
-    readonly maximumWidth: number;
-    readonly activeGroup: T | undefined;
-    readonly size: number;
-    readonly groups: T[];
-    readonly onDidMaximizedChange: Event<MaximizedChanged<T>>;
-    readonly onDidLayoutChange: Event<void>;
-    getPanel(id: string): T | undefined;
-    toJSON(): object;
-    fromJSON(data: any): void;
-    clear(): void;
-    layout(width: number, height: number, force?: boolean): void;
-    setVisible(panel: T, visible: boolean): void;
-    isVisible(panel: T): boolean;
-    maximizeGroup(panel: T): void;
-    isMaximizedGroup(panel: T): boolean;
-    exitMaximizedGroup(): void;
-    hasMaximizedGroup(): boolean;
-}
-export declare abstract class BaseGrid<T extends IGridPanelView> extends Resizable implements IBaseGrid<T> {
-    private readonly _id;
-    protected readonly _groups: Map<string, IValueDisposable<T>>;
-    protected readonly gridview: Gridview;
-    protected _activeGroup: T | undefined;
-    private readonly _onDidRemove;
-    readonly onDidRemove: Event<T>;
-    private readonly _onDidAdd;
-    readonly onDidAdd: Event<T>;
-    private readonly _onDidMaximizedChange;
-    readonly onDidMaximizedChange: Event<MaximizedChanged<T>>;
-    private readonly _onDidActiveChange;
-    readonly onDidActiveChange: Event<T | undefined>;
-    protected readonly _bufferOnDidLayoutChange: AsapEvent;
-    readonly onDidLayoutChange: Event<void>;
-    private readonly _onDidViewVisibilityChangeMicroTaskQueue;
-    readonly onDidViewVisibilityChangeMicroTaskQueue: Event<void>;
-    private readonly _classNames;
-    get id(): string;
-    get size(): number;
-    get groups(): T[];
-    get width(): number;
-    get height(): number;
-    get minimumHeight(): number;
-    get maximumHeight(): number;
-    get minimumWidth(): number;
-    get maximumWidth(): number;
-    get activeGroup(): T | undefined;
-    get locked(): boolean;
-    set locked(value: boolean);
-    constructor(container: HTMLElement, options: BaseGridOptions);
-    abstract toJSON(): object;
-    abstract fromJSON(data: any): void;
-    abstract clear(): void;
-    setVisible(panel: T, visible: boolean): void;
-    isVisible(panel: T): boolean;
-    updateOptions(options: Partial<BaseGridOptions>): void;
-    maximizeGroup(panel: T): void;
-    isMaximizedGroup(panel: T): boolean;
-    exitMaximizedGroup(): void;
-    hasMaximizedGroup(): boolean;
-    protected doAddGroup(group: T, location?: number[], size?: number, gridview?: Gridview): void;
-    protected doRemoveGroup(group: T, options?: {
-        skipActive?: boolean;
-        skipDispose?: boolean;
-    }): T;
-    getPanel(id: string): T | undefined;
-    doSetGroupActive(group: T | undefined): void;
-    removeGroup(group: T): void;
-    moveToNext(options?: MovementOptions2): void;
-    moveToPrevious(options?: MovementOptions2): void;
-    protected forceRelayout(): void;
-    layout(width: number, height: number, forceResize?: boolean): void;
-    dispose(): void;
-}

package/dist/esm/gridview/baseComponentGridview.js

@@ -1,237 +0,0 @@
-import { Emitter, Event, AsapEvent } from '../events';
-import { getGridLocation, Gridview } from './gridview';
-import { Disposable } from '../lifecycle';
-import { sequentialNumberGenerator } from '../math';
-import { Sizing } from '../splitview/splitview';
-import { Resizable } from '../resizable';
-import { Classnames } from '../dom';
-const nextLayoutId = sequentialNumberGenerator();
-export function toTarget(direction) {
-    switch (direction) {
-        case 'left':
-            return 'left';
-        case 'right':
-            return 'right';
-        case 'above':
-            return 'top';
-        case 'below':
-            return 'bottom';
-        case 'within':
-        default:
-            return 'center';
-    }
-}
-export class BaseGrid extends Resizable {
-    get id() {
-        return this._id;
-    }
-    get size() {
-        return this._groups.size;
-    }
-    get groups() {
-        return Array.from(this._groups.values()).map((_) => _.value);
-    }
-    get width() {
-        return this.gridview.width;
-    }
-    get height() {
-        return this.gridview.height;
-    }
-    get minimumHeight() {
-        return this.gridview.minimumHeight;
-    }
-    get maximumHeight() {
-        return this.gridview.maximumHeight;
-    }
-    get minimumWidth() {
-        return this.gridview.minimumWidth;
-    }
-    get maximumWidth() {
-        return this.gridview.maximumWidth;
-    }
-    get activeGroup() {
-        return this._activeGroup;
-    }
-    get locked() {
-        return this.gridview.locked;
-    }
-    set locked(value) {
-        this.gridview.locked = value;
-    }
-    constructor(container, options) {
-        var _a;
-        super(document.createElement('div'), options.disableAutoResizing);
-        this._id = nextLayoutId.next();
-        this._groups = new Map();
-        this._onDidRemove = new Emitter();
-        this.onDidRemove = this._onDidRemove.event;
-        this._onDidAdd = new Emitter();
-        this.onDidAdd = this._onDidAdd.event;
-        this._onDidMaximizedChange = new Emitter();
-        this.onDidMaximizedChange = this._onDidMaximizedChange.event;
-        this._onDidActiveChange = new Emitter();
-        this.onDidActiveChange = this._onDidActiveChange.event;
-        this._bufferOnDidLayoutChange = new AsapEvent();
-        this.onDidLayoutChange = this._bufferOnDidLayoutChange.onEvent;
-        this._onDidViewVisibilityChangeMicroTaskQueue = new AsapEvent();
-        this.onDidViewVisibilityChangeMicroTaskQueue = this._onDidViewVisibilityChangeMicroTaskQueue.onEvent;
-        this.element.style.height = '100%';
-        this.element.style.width = '100%';
-        this._classNames = new Classnames(this.element);
-        this._classNames.setClassNames((_a = options.className) !== null && _a !== void 0 ? _a : '');
-        // the container is owned by the third-party, do not modify/delete it
-        container.appendChild(this.element);
-        this.gridview = new Gridview(!!options.proportionalLayout, options.styles, options.orientation, options.locked, options.margin);
-        this.gridview.locked = !!options.locked;
-        this.element.appendChild(this.gridview.element);
-        this.layout(0, 0, true); // set some elements height/widths
-        this.addDisposables(this.gridview.onDidMaximizedNodeChange((event) => {
-            this._onDidMaximizedChange.fire({
-                panel: event.view,
-                isMaximized: event.isMaximized,
-            });
-        }), this.gridview.onDidViewVisibilityChange(() => this._onDidViewVisibilityChangeMicroTaskQueue.fire()), this.onDidViewVisibilityChangeMicroTaskQueue(() => {
-            this.forceRelayout();
-        }), Disposable.from(() => {
-            this.element.remove();
-        }), this.gridview.onDidChange(() => {
-            this._bufferOnDidLayoutChange.fire();
-        }), Event.any(this.onDidAdd, this.onDidRemove, this.onDidActiveChange)(() => {
-            this._bufferOnDidLayoutChange.fire();
-        }), this._onDidMaximizedChange, this._onDidViewVisibilityChangeMicroTaskQueue, this._bufferOnDidLayoutChange);
-    }
-    setVisible(panel, visible) {
-        this.gridview.setViewVisible(getGridLocation(panel.element), visible);
-        this._bufferOnDidLayoutChange.fire();
-    }
-    isVisible(panel) {
-        return this.gridview.isViewVisible(getGridLocation(panel.element));
-    }
-    updateOptions(options) {
-        var _a, _b, _c, _d;
-        if (typeof options.proportionalLayout === 'boolean') {
-            // this.gridview.proportionalLayout = options.proportionalLayout; // not supported
-        }
-        if (options.orientation) {
-            this.gridview.orientation = options.orientation;
-        }
-        if ('styles' in options) {
-            // this.gridview.styles = options.styles; // not supported
-        }
-        if ('disableResizing' in options) {
-            this.disableResizing = (_a = options.disableAutoResizing) !== null && _a !== void 0 ? _a : false;
-        }
-        if ('locked' in options) {
-            this.locked = (_b = options.locked) !== null && _b !== void 0 ? _b : false;
-        }
-        if ('margin' in options) {
-            this.gridview.margin = (_c = options.margin) !== null && _c !== void 0 ? _c : 0;
-        }
-        if ('className' in options) {
-            this._classNames.setClassNames((_d = options.className) !== null && _d !== void 0 ? _d : '');
-        }
-    }
-    maximizeGroup(panel) {
-        this.gridview.maximizeView(panel);
-        this.doSetGroupActive(panel);
-    }
-    isMaximizedGroup(panel) {
-        return this.gridview.maximizedView() === panel;
-    }
-    exitMaximizedGroup() {
-        this.gridview.exitMaximizedView();
-    }
-    hasMaximizedGroup() {
-        return this.gridview.hasMaximizedView();
-    }
-    doAddGroup(group, location = [0], size, gridview = this.gridview) {
-        gridview.addView(group, size !== null && size !== void 0 ? size : Sizing.Distribute, location);
-        this._onDidAdd.fire(group);
-    }
-    doRemoveGroup(group, options) {
-        if (!this._groups.has(group.id)) {
-            throw new Error('invalid operation');
-        }
-        const item = this._groups.get(group.id);
-        const view = this.gridview.remove(group, Sizing.Distribute);
-        if (item && !(options === null || options === void 0 ? void 0 : options.skipDispose)) {
-            item.disposable.dispose();
-            item.value.dispose();
-            this._groups.delete(group.id);
-            this._onDidRemove.fire(group);
-        }
-        if (!(options === null || options === void 0 ? void 0 : options.skipActive) && this._activeGroup === group) {
-            const groups = Array.from(this._groups.values());
-            this.doSetGroupActive(groups.length > 0 ? groups[0].value : undefined);
-        }
-        return view;
-    }
-    getPanel(id) {
-        var _a;
-        return (_a = this._groups.get(id)) === null || _a === void 0 ? void 0 : _a.value;
-    }
-    doSetGroupActive(group) {
-        if (this._activeGroup === group) {
-            return;
-        }
-        if (this._activeGroup) {
-            this._activeGroup.setActive(false);
-        }
-        if (group) {
-            group.setActive(true);
-        }
-        this._activeGroup = group;
-        this._onDidActiveChange.fire(group);
-    }
-    removeGroup(group) {
-        this.doRemoveGroup(group);
-    }
-    moveToNext(options) {
-        var _a;
-        options !== null && options !== void 0 ? options : (options = {});
-        if (!options.group) {
-            if (!this.activeGroup) {
-                return;
-            }
-            options.group = this.activeGroup;
-        }
-        const location = getGridLocation(options.group.element);
-        const next = (_a = this.gridview.next(location)) === null || _a === void 0 ? void 0 : _a.view;
-        this.doSetGroupActive(next);
-    }
-    moveToPrevious(options) {
-        var _a;
-        options !== null && options !== void 0 ? options : (options = {});
-        if (!options.group) {
-            if (!this.activeGroup) {
-                return;
-            }
-            options.group = this.activeGroup;
-        }
-        const location = getGridLocation(options.group.element);
-        const next = (_a = this.gridview.previous(location)) === null || _a === void 0 ? void 0 : _a.view;
-        this.doSetGroupActive(next);
-    }
-    forceRelayout() {
-        this.layout(this.width, this.height, true);
-    }
-    layout(width, height, forceResize) {
-        const different = forceResize || width !== this.width || height !== this.height;
-        if (!different) {
-            return;
-        }
-        this.gridview.element.style.height = `${height}px`;
-        this.gridview.element.style.width = `${width}px`;
-        this.gridview.layout(width, height);
-    }
-    dispose() {
-        this._onDidActiveChange.dispose();
-        this._onDidAdd.dispose();
-        this._onDidRemove.dispose();
-        for (const group of this.groups) {
-            group.dispose();
-        }
-        this.gridview.dispose();
-        super.dispose();
-    }
-}

package/dist/esm/gridview/basePanelView.d.ts

@@ -1,40 +0,0 @@
-import { CompositeDisposable } from '../lifecycle';
-import { IFrameworkPart, PanelUpdateEvent, PanelInitParameters, IPanel, Parameters } from '../panel/types';
-import { PanelApi, PanelApiImpl } from '../api/panelApi';
-export interface BasePanelViewState {
-    readonly id: string;
-    readonly component: string;
-    readonly params?: Parameters;
-}
-export interface BasePanelViewExported<T extends PanelApi> {
-    readonly id: string;
-    readonly api: T;
-    readonly width: number;
-    readonly height: number;
-    readonly params: Parameters | undefined;
-    focus(): void;
-    toJSON(): object;
-    update(event: PanelUpdateEvent): void;
-}
-export declare abstract class BasePanelView<T extends PanelApiImpl> extends CompositeDisposable implements IPanel, BasePanelViewExported<T> {
-    readonly id: string;
-    protected readonly component: string;
-    readonly api: T;
-    private _height;
-    private _width;
-    private readonly _element;
-    protected part?: IFrameworkPart;
-    protected _params?: PanelInitParameters;
-    protected abstract getComponent(): IFrameworkPart;
-    get element(): HTMLElement;
-    get width(): number;
-    get height(): number;
-    get params(): Parameters | undefined;
-    constructor(id: string, component: string, api: T);
-    focus(): void;
-    layout(width: number, height: number): void;
-    init(parameters: PanelInitParameters): void;
-    update(event: PanelUpdateEvent): void;
-    toJSON(): BasePanelViewState;
-    dispose(): void;
-}

package/dist/esm/gridview/basePanelView.js

@@ -1,91 +0,0 @@
-import { trackFocus } from '../dom';
-import { CompositeDisposable } from '../lifecycle';
-import { WillFocusEvent } from '../api/panelApi';
-export class BasePanelView extends CompositeDisposable {
-    get element() {
-        return this._element;
-    }
-    get width() {
-        return this._width;
-    }
-    get height() {
-        return this._height;
-    }
-    get params() {
-        var _a;
-        return (_a = this._params) === null || _a === void 0 ? void 0 : _a.params;
-    }
-    constructor(id, component, api) {
-        super();
-        this.id = id;
-        this.component = component;
-        this.api = api;
-        this._height = 0;
-        this._width = 0;
-        this._element = document.createElement('div');
-        this._element.tabIndex = -1;
-        this._element.style.outline = 'none';
-        this._element.style.height = '100%';
-        this._element.style.width = '100%';
-        this._element.style.overflow = 'hidden';
-        const focusTracker = trackFocus(this._element);
-        this.addDisposables(this.api, focusTracker.onDidFocus(() => {
-            this.api._onDidChangeFocus.fire({ isFocused: true });
-        }), focusTracker.onDidBlur(() => {
-            this.api._onDidChangeFocus.fire({ isFocused: false });
-        }), focusTracker);
-    }
-    focus() {
-        const event = new WillFocusEvent();
-        this.api._onWillFocus.fire(event);
-        if (event.defaultPrevented) {
-            return;
-        }
-        this._element.focus();
-    }
-    layout(width, height) {
-        this._width = width;
-        this._height = height;
-        this.api._onDidDimensionChange.fire({ width, height });
-        if (this.part) {
-            if (this._params) {
-                this.part.update(this._params.params);
-            }
-        }
-    }
-    init(parameters) {
-        this._params = parameters;
-        this.part = this.getComponent();
-    }
-    update(event) {
-        var _a, _b;
-        // merge the new parameters with the existing parameters
-        this._params = Object.assign(Object.assign({}, this._params), { params: Object.assign(Object.assign({}, (_a = this._params) === null || _a === void 0 ? void 0 : _a.params), event.params) });
-        /**
-         * delete new keys that have a value of undefined,
-         * allow values of null
-         */
-        for (const key of Object.keys(event.params)) {
-            if (event.params[key] === undefined) {
-                delete this._params.params[key];
-            }
-        }
-        // update the view with the updated props
-        (_b = this.part) === null || _b === void 0 ? void 0 : _b.update({ params: this._params.params });
-    }
-    toJSON() {
-        var _a, _b;
-        const params = (_b = (_a = this._params) === null || _a === void 0 ? void 0 : _a.params) !== null && _b !== void 0 ? _b : {};
-        return {
-            id: this.id,
-            component: this.component,
-            params: Object.keys(params).length > 0 ? params : undefined,
-        };
-    }
-    dispose() {
-        var _a;
-        this.api.dispose();
-        (_a = this.part) === null || _a === void 0 ? void 0 : _a.dispose();
-        super.dispose();
-    }
-}

package/dist/esm/gridview/branchNode.d.ts

@@ -1,57 +0,0 @@
-import { IView, Orientation, Sizing, LayoutPriority, ISplitviewStyles } from '../splitview/splitview';
-import { Event } from '../events';
-import { INodeDescriptor } from './gridview';
-import { Node } from './types';
-import { CompositeDisposable } from '../lifecycle';
-export declare class BranchNode extends CompositeDisposable implements IView {
-    readonly orientation: Orientation;
-    readonly proportionalLayout: boolean;
-    readonly styles: ISplitviewStyles | undefined;
-    readonly element: HTMLElement;
-    private readonly splitview;
-    private _orthogonalSize;
-    private _size;
-    private _childrenDisposable;
-    readonly children: Node[];
-    private readonly _onDidChange;
-    readonly onDidChange: Event<{
-        size?: number;
-        orthogonalSize?: number;
-    }>;
-    private readonly _onDidVisibilityChange;
-    readonly onDidVisibilityChange: Event<{
-        visible: boolean;
-    }>;
-    get width(): number;
-    get height(): number;
-    get minimumSize(): number;
-    get maximumSize(): number;
-    get minimumOrthogonalSize(): number;
-    get maximumOrthogonalSize(): number;
-    get orthogonalSize(): number;
-    get size(): number;
-    get minimumWidth(): number;
-    get minimumHeight(): number;
-    get maximumWidth(): number;
-    get maximumHeight(): number;
-    get priority(): LayoutPriority;
-    get disabled(): boolean;
-    set disabled(value: boolean);
-    get margin(): number;
-    set margin(value: number);
-    constructor(orientation: Orientation, proportionalLayout: boolean, styles: ISplitviewStyles | undefined, size: number, orthogonalSize: number, disabled: boolean, margin: number | undefined, childDescriptors?: INodeDescriptor[]);
-    setVisible(_visible: boolean): void;
-    isChildVisible(index: number): boolean;
-    setChildVisible(index: number, visible: boolean): void;
-    moveChild(from: number, to: number): void;
-    getChildSize(index: number): number;
-    resizeChild(index: number, size: number): void;
-    layout(size: number, orthogonalSize: number): void;
-    addChild(node: Node, size: number | Sizing, index: number, skipLayout?: boolean): void;
-    getChildCachedVisibleSize(index: number): number | undefined;
-    removeChild(index: number, sizing?: Sizing): Node;
-    private _addChild;
-    private _removeChild;
-    private setupChildrenEvents;
-    dispose(): void;
-}