dockview 1.6.0 → 1.7.1

package/dist/esm/gridview/baseComponentGridview.js

@@ -1,188 +0,0 @@
-import { Emitter, Event, TickDelayedEvent } from '../events';
-import { getGridLocation, Gridview } from './gridview';
-import { CompositeDisposable } from '../lifecycle';
-import { sequentialNumberGenerator } from '../math';
-import { Sizing, } from '../splitview/core/splitview';
-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 CompositeDisposable {
-    get id() {
-        return this._id;
-    }
-    get element() {
-        return this._element;
-    }
-    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;
-    }
-    constructor(_element, options) {
-        super();
-        this._element = _element;
-        this._id = nextLayoutId.next();
-        this._groups = new Map();
-        this._onDidLayoutChange = new Emitter();
-        this.onDidLayoutChange = this._onDidLayoutChange.event;
-        this._onDidRemoveGroup = new Emitter();
-        this.onDidRemoveGroup = this._onDidRemoveGroup.event;
-        this._onDidAddGroup = new Emitter();
-        this.onDidAddGroup = this._onDidAddGroup.event;
-        this._onDidActiveGroupChange = new Emitter();
-        this.onDidActiveGroupChange = this._onDidActiveGroupChange.event;
-        this._bufferOnDidLayoutChange = new TickDelayedEvent();
-        this.gridview = new Gridview(!!options.proportionalLayout, options.styles, options.orientation);
-        this.element.appendChild(this.gridview.element);
-        this.layout(0, 0, true); // set some elements height/widths
-        this.addDisposables(this.gridview.onDidChange(() => {
-            this._bufferOnDidLayoutChange.fire();
-        }));
-        this.addDisposables(Event.any(this.onDidAddGroup, this.onDidRemoveGroup, this.onDidActiveGroupChange)(() => {
-            this._bufferOnDidLayoutChange.fire();
-        }), this._bufferOnDidLayoutChange.onEvent(() => {
-            this._onDidLayoutChange.fire();
-        }), this._bufferOnDidLayoutChange);
-    }
-    setVisible(panel, visible) {
-        this.gridview.setViewVisible(getGridLocation(panel.element), visible);
-        this._onDidLayoutChange.fire();
-    }
-    isVisible(panel) {
-        return this.gridview.isViewVisible(getGridLocation(panel.element));
-    }
-    doAddGroup(group, location = [0], size) {
-        this.gridview.addView(group, size !== null && size !== void 0 ? size : Sizing.Distribute, location);
-        this._onDidAddGroup.fire(group);
-        this.doSetGroupActive(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._onDidRemoveGroup.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, skipFocus) {
-        if (this._activeGroup === group) {
-            return;
-        }
-        if (this._activeGroup) {
-            this._activeGroup.setActive(false);
-            if (!skipFocus) {
-                this._activeGroup.focus();
-            }
-        }
-        if (group) {
-            group.setActive(true);
-            if (!skipFocus) {
-                group.focus();
-            }
-        }
-        this._activeGroup = group;
-        this._onDidActiveGroupChange.fire(group);
-    }
-    removeGroup(group) {
-        this.doRemoveGroup(group);
-    }
-    moveToNext(options) {
-        var _a;
-        if (!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;
-        if (!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);
-    }
-    layout(width, height, forceResize) {
-        const different = forceResize || width !== this.width || height !== this.height;
-        if (!different) {
-            return;
-        }
-        this.element.style.height = `${height}px`;
-        this.element.style.width = `${width}px`;
-        this.gridview.layout(width, height);
-    }
-    dispose() {
-        super.dispose();
-        this._onDidActiveGroupChange.dispose();
-        this._onDidAddGroup.dispose();
-        this._onDidRemoveGroup.dispose();
-        this._onDidLayoutChange.dispose();
-        for (const group of this.groups) {
-            group.dispose();
-        }
-        this.gridview.dispose();
-    }
-}

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

@@ -1,43 +0,0 @@
-import { CompositeDisposable } from '../lifecycle';
-import { IFrameworkPart, PanelUpdateEvent, PanelInitParameters, IPanel } from '../panel/types';
-import { PanelApi, PanelApiImpl } from '../api/panelApi';
-export interface BasePanelViewState {
-    id: string;
-    component: string;
-    params?: Record<string, any>;
-}
-export interface BasePanelViewExported<T extends PanelApi> {
-    readonly id: string;
-    readonly api: T;
-    readonly width: number;
-    readonly height: number;
-    readonly params: Record<string, any> | 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 _element;
-    protected part?: IFrameworkPart;
-    protected _params?: PanelInitParameters;
-    /**
-     * Provide an IFrameworkPart that will determine the rendered UI of this view piece.
-     */
-    protected abstract getComponent(): IFrameworkPart;
-    get element(): HTMLElement;
-    get width(): number;
-    get height(): number;
-    get params(): Record<string, any> | 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,74 +0,0 @@
-import { trackFocus } from '../dom';
-import { CompositeDisposable } from '../lifecycle';
-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 { onDidFocus, onDidBlur } = trackFocus(this._element);
-        this.addDisposables(this.api, onDidFocus(() => {
-            this.api._onDidChangeFocus.fire({ isFocused: true });
-        }), onDidBlur(() => {
-            this.api._onDidChangeFocus.fire({ isFocused: false });
-        }));
-    }
-    focus() {
-        this.api._onFocusEvent.fire();
-    }
-    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;
-        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) });
-        (_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;
-        super.dispose();
-        this.api.dispose();
-        (_a = this.part) === null || _a === void 0 ? void 0 : _a.dispose();
-    }
-}

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

@@ -1,49 +0,0 @@
-import { IView, Orientation, Sizing, LayoutPriority, ISplitviewStyles } from '../splitview/core/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 splitview;
-    private _orthogonalSize;
-    private _size;
-    readonly children: Node[];
-    private readonly _onDidChange;
-    readonly onDidChange: Event<{
-        size?: number;
-        orthogonalSize?: number;
-    }>;
-    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;
-    constructor(orientation: Orientation, proportionalLayout: boolean, styles: ISplitviewStyles | undefined, size: number, orthogonalSize: number, 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): void;
-    private _addChild;
-    private _removeChild;
-    private _childrenDisposable;
-    private setupChildrenEvents;
-    dispose(): void;
-}

package/dist/esm/gridview/branchNode.js

@@ -1,218 +0,0 @@
-/*---------------------------------------------------------------------------------------------
- * Accreditation: This file is largly based upon the MIT licenced VSCode sourcecode found at:
- * https://github.com/microsoft/vscode/tree/main/src/vs/base/browser/ui/grid
- *--------------------------------------------------------------------------------------------*/
-import { Splitview, Orientation, LayoutPriority, } from '../splitview/core/splitview';
-import { Emitter, Event } from '../events';
-import { LeafNode } from './leafNode';
-import { CompositeDisposable, Disposable } from '../lifecycle';
-export class BranchNode extends CompositeDisposable {
-    get width() {
-        return this.orientation === Orientation.HORIZONTAL
-            ? this.size
-            : this.orthogonalSize;
-    }
-    get height() {
-        return this.orientation === Orientation.HORIZONTAL
-            ? this.orthogonalSize
-            : this.size;
-    }
-    get minimumSize() {
-        return this.children.length === 0
-            ? 0
-            : Math.max(...this.children.map((c) => c.minimumOrthogonalSize));
-    }
-    get maximumSize() {
-        return Math.min(...this.children.map((c) => c.maximumOrthogonalSize));
-    }
-    get minimumOrthogonalSize() {
-        return this.splitview.minimumSize;
-    }
-    get maximumOrthogonalSize() {
-        return this.splitview.maximumSize;
-    }
-    get orthogonalSize() {
-        return this._orthogonalSize;
-    }
-    get size() {
-        return this._size;
-    }
-    get minimumWidth() {
-        return this.orientation === Orientation.HORIZONTAL
-            ? this.minimumOrthogonalSize
-            : this.minimumSize;
-    }
-    get minimumHeight() {
-        return this.orientation === Orientation.HORIZONTAL
-            ? this.minimumSize
-            : this.minimumOrthogonalSize;
-    }
-    get maximumWidth() {
-        return this.orientation === Orientation.HORIZONTAL
-            ? this.maximumOrthogonalSize
-            : this.maximumSize;
-    }
-    get maximumHeight() {
-        return this.orientation === Orientation.HORIZONTAL
-            ? this.maximumSize
-            : this.maximumOrthogonalSize;
-    }
-    get priority() {
-        if (this.children.length === 0) {
-            return LayoutPriority.Normal;
-        }
-        const priorities = this.children.map((c) => typeof c.priority === 'undefined'
-            ? LayoutPriority.Normal
-            : c.priority);
-        if (priorities.some((p) => p === LayoutPriority.High)) {
-            return LayoutPriority.High;
-        }
-        else if (priorities.some((p) => p === LayoutPriority.Low)) {
-            return LayoutPriority.Low;
-        }
-        return LayoutPriority.Normal;
-    }
-    constructor(orientation, proportionalLayout, styles, size, orthogonalSize, childDescriptors) {
-        super();
-        this.orientation = orientation;
-        this.proportionalLayout = proportionalLayout;
-        this.styles = styles;
-        this.children = [];
-        this._onDidChange = new Emitter();
-        this.onDidChange = this._onDidChange.event;
-        this._childrenDisposable = Disposable.NONE;
-        this._orthogonalSize = orthogonalSize;
-        this._size = size;
-        this.element = document.createElement('div');
-        this.element.className = 'branch-node';
-        if (!childDescriptors) {
-            this.splitview = new Splitview(this.element, {
-                orientation: this.orientation,
-                proportionalLayout,
-                styles,
-            });
-            this.splitview.layout(this.size, this.orthogonalSize);
-        }
-        else {
-            const descriptor = {
-                views: childDescriptors.map((childDescriptor) => {
-                    return {
-                        view: childDescriptor.node,
-                        size: childDescriptor.node.size,
-                        visible: childDescriptor.node instanceof LeafNode &&
-                            childDescriptor.visible !== undefined
-                            ? childDescriptor.visible
-                            : true,
-                    };
-                }),
-                size: this.size,
-            };
-            this.children = childDescriptors.map((c) => c.node);
-            this.splitview = new Splitview(this.element, {
-                orientation: this.orientation,
-                descriptor,
-                proportionalLayout,
-            });
-        }
-        this.addDisposables(this._onDidChange, this.splitview.onDidSashEnd(() => {
-            this._onDidChange.fire({});
-        }));
-        this.setupChildrenEvents();
-    }
-    setVisible(visible) {
-        for (const child of this.children) {
-            child.setVisible(visible);
-        }
-    }
-    isChildVisible(index) {
-        if (index < 0 || index >= this.children.length) {
-            throw new Error('Invalid index');
-        }
-        return this.splitview.isViewVisible(index);
-    }
-    setChildVisible(index, visible) {
-        if (index < 0 || index >= this.children.length) {
-            throw new Error('Invalid index');
-        }
-        if (this.splitview.isViewVisible(index) === visible) {
-            return;
-        }
-        this.splitview.setViewVisible(index, visible);
-    }
-    moveChild(from, to) {
-        if (from === to) {
-            return;
-        }
-        if (from < 0 || from >= this.children.length) {
-            throw new Error('Invalid from index');
-        }
-        if (from < to) {
-            to--;
-        }
-        this.splitview.moveView(from, to);
-        const child = this._removeChild(from);
-        this._addChild(child, to);
-    }
-    getChildSize(index) {
-        if (index < 0 || index >= this.children.length) {
-            throw new Error('Invalid index');
-        }
-        return this.splitview.getViewSize(index);
-    }
-    resizeChild(index, size) {
-        if (index < 0 || index >= this.children.length) {
-            throw new Error('Invalid index');
-        }
-        this.splitview.resizeView(index, size);
-    }
-    layout(size, orthogonalSize) {
-        this._size = orthogonalSize;
-        this._orthogonalSize = size;
-        this.splitview.layout(this.size, this.orthogonalSize);
-    }
-    addChild(node, size, index, skipLayout) {
-        if (index < 0 || index > this.children.length) {
-            throw new Error('Invalid index');
-        }
-        this.splitview.addView(node, size, index, skipLayout);
-        this._addChild(node, index);
-    }
-    getChildCachedVisibleSize(index) {
-        if (index < 0 || index >= this.children.length) {
-            throw new Error('Invalid index');
-        }
-        return this.splitview.getViewCachedVisibleSize(index);
-    }
-    removeChild(index, sizing) {
-        if (index < 0 || index >= this.children.length) {
-            throw new Error('Invalid index');
-        }
-        this.splitview.removeView(index, sizing);
-        this._removeChild(index);
-    }
-    _addChild(node, index) {
-        this.children.splice(index, 0, node);
-        this.setupChildrenEvents();
-    }
-    _removeChild(index) {
-        const [child] = this.children.splice(index, 1);
-        this.setupChildrenEvents();
-        return child;
-    }
-    setupChildrenEvents() {
-        this._childrenDisposable.dispose();
-        this._childrenDisposable = Event.any(...this.children.map((c) => c.onDidChange))((e) => {
-            /**
-             * indicate a change has occured to allows any re-rendering but don't bubble
-             * event because that was specific to this branch
-             */
-            this._onDidChange.fire({ size: e.orthogonalSize });
-        });
-    }
-    dispose() {
-        super.dispose();
-        this._childrenDisposable.dispose();
-        this.children.forEach((child) => child.dispose());
-        this.splitview.dispose();
-    }
-}

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

@@ -1,85 +0,0 @@
-import { SerializedGridObject } from './gridview';
-import { IPanelDeserializer } from '../dockview/deserializer';
-import { GridviewComponentOptions } from './options';
-import { BaseGrid, Direction, IBaseGrid, IGridPanelView } from './baseComponentGridview';
-import { GridviewPanel, GridviewInitParameters, GridPanelViewState, IGridviewPanel } from './gridviewPanel';
-import { BaseComponentOptions } from '../panel/types';
-import { Orientation, Sizing } from '../splitview/core/splitview';
-import { Event } from '../events';
-import { Position } from '../dnd/droptarget';
-export interface SerializedGridview {
-    grid: {
-        height: number;
-        width: number;
-        orientation: Orientation;
-        root: SerializedGridObject<GridPanelViewState>;
-    };
-    activePanel?: string;
-}
-export interface AddComponentOptions extends BaseComponentOptions {
-    minimumWidth?: number;
-    maximumWidth?: number;
-    minimumHeight?: number;
-    maximumHeight?: number;
-    position?: {
-        direction: Direction;
-        referencePanel: string;
-    };
-    location?: number[];
-}
-export interface IGridPanelComponentView extends IGridPanelView {
-    init: (params: GridviewInitParameters) => void;
-}
-export type GridviewComponentUpdateOptions = Pick<GridviewComponentOptions, 'orientation' | 'components' | 'frameworkComponents'>;
-export interface IGridviewComponent extends IBaseGrid<GridviewPanel> {
-    readonly orientation: Orientation;
-    readonly onDidLayoutFromJSON: Event<void>;
-    updateOptions(options: Partial<GridviewComponentUpdateOptions>): void;
-    addPanel(options: AddComponentOptions): IGridviewPanel;
-    removePanel(panel: IGridviewPanel, sizing?: Sizing): void;
-    focus(): void;
-    fromJSON(serializedGridview: SerializedGridview): void;
-    toJSON(): SerializedGridview;
-    movePanel(panel: IGridviewPanel, options: {
-        direction: Direction;
-        reference: string;
-        size?: number;
-    }): void;
-    setVisible(panel: IGridviewPanel, visible: boolean): void;
-    setActive(panel: IGridviewPanel): void;
-}
-export declare class GridviewComponent extends BaseGrid<GridviewPanel> implements IGridviewComponent {
-    private _options;
-    private _deserializer;
-    private readonly _onDidLayoutfromJSON;
-    readonly onDidLayoutFromJSON: Event<void>;
-    get orientation(): Orientation;
-    set orientation(value: Orientation);
-    get options(): GridviewComponentOptions;
-    get deserializer(): IPanelDeserializer | undefined;
-    set deserializer(value: IPanelDeserializer | undefined);
-    constructor(element: HTMLElement, options: GridviewComponentOptions);
-    updateOptions(options: Partial<GridviewComponentUpdateOptions>): void;
-    removePanel(panel: GridviewPanel): void;
-    /**
-     * Serialize the current state of the layout
-     *
-     * @returns A JSON respresentation of the layout
-     */
-    toJSON(): SerializedGridview;
-    setVisible(panel: GridviewPanel, visible: boolean): void;
-    setActive(panel: GridviewPanel): void;
-    focus(): void;
-    fromJSON(serializedGridview: SerializedGridview): void;
-    clear(): void;
-    movePanel(panel: GridviewPanel, options: {
-        direction: Direction;
-        reference: string;
-        size?: number;
-    }): void;
-    addPanel(options: AddComponentOptions): IGridviewPanel;
-    private registerPanel;
-    moveGroup(referenceGroup: IGridPanelComponentView, groupId: string, target: Position): void;
-    removeGroup(group: GridviewPanel): void;
-    dispose(): void;
-}