dockview-core 1.16.0 → 1.16.1

package/dist/esm/api/component.api.d.ts

@@ -2,11 +2,11 @@ import { FloatingGroupOptions, IDockviewComponent, MovePanelEvent, SerializedDoc
 import { AddGroupOptions, AddPanelOptions, DockviewComponentOptions, DockviewDndOverlayEvent, MovementOptions } from '../dockview/options';
 import { Parameters } from '../panel/types';
 import { Direction } from '../gridview/baseComponentGridview';
-import { AddComponentOptions, GridviewComponentUpdateOptions, IGridviewComponent, SerializedGridviewComponent } from '../gridview/gridviewComponent';
+import { AddComponentOptions, IGridviewComponent, SerializedGridviewComponent } from '../gridview/gridviewComponent';
 import { IGridviewPanel } from '../gridview/gridviewPanel';
 import { AddPaneviewComponentOptions, SerializedPaneview, IPaneviewComponent } from '../paneview/paneviewComponent';
 import { IPaneviewPanel } from '../paneview/paneviewPanel';
-import { AddSplitviewComponentOptions, ISplitviewComponent, SerializedSplitview, SplitviewComponentUpdateOptions } from '../splitview/splitviewComponent';
+import { AddSplitviewComponentOptions, ISplitviewComponent, SerializedSplitview } from '../splitview/splitviewComponent';
 import { IView, Orientation, Sizing } from '../splitview/splitview';
 import { ISplitviewPanel } from '../splitview/splitviewPanel';
 import { DockviewGroupPanel, IDockviewGroupPanel } from '../dockview/dockviewGroupPanel';
@@ -17,6 +17,8 @@ import { GroupDragEvent, TabDragEvent } from '../dockview/components/titlebar/ta
 import { Box } from '../types';
 import { DockviewDidDropEvent, DockviewWillDropEvent, WillShowOverlayLocationEvent } from '../dockview/dockviewGroupPanelModel';
 import { PaneviewComponentOptions } from '../paneview/options';
+import { SplitviewComponentOptions } from '../splitview/options';
+import { GridviewComponentOptions } from '../gridview/options';
 export interface CommonApi<T = any> {
     readonly height: number;
     readonly width: number;
@@ -115,7 +117,7 @@ export declare class SplitviewApi implements CommonApi<SerializedSplitview> {
     /**
      * Update configuratable options.
      */
-    updateOptions(options: Partial<SplitviewComponentUpdateOptions>): void;
+    updateOptions(options: Partial<SplitviewComponentOptions>): void;
     /**
      * Release resources and teardown component. Do not call when using framework versions of dockview.
      */
@@ -305,7 +307,7 @@ export declare class GridviewApi implements CommonApi<SerializedGridviewComponen
      * Reset the component back to an empty and default state.
      */
     clear(): void;
-    updateOptions(options: Partial<GridviewComponentUpdateOptions>): void;
+    updateOptions(options: Partial<GridviewComponentOptions>): void;
     /**
      * Release resources and teardown component. Do not call when using framework versions of dockview.
      */

package/dist/esm/dockview/dockviewComponent.js

@@ -593,6 +593,7 @@ export class DockviewComponent extends BaseGrid {
     }
     updateOptions(options) {
         var _a, _b;
+        super.updateOptions(options);
         const changed_floatingGroupBounds = 'floatingGroupBounds' in options &&
             options.floatingGroupBounds !== this.options.floatingGroupBounds;
         const changed_rootOverlayOptions = 'rootOverlayModel' in options &&

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

@@ -63,6 +63,7 @@ export declare abstract class BaseGrid<T extends IGridPanelView> extends Resizab
     readonly onDidLayoutChange: Event<void>;
     private readonly _onDidViewVisibilityChangeMicroTaskQueue;
     readonly onDidViewVisibilityChangeMicroTaskQueue: Event<void>;
+    private classNames;
     get id(): string;
     get size(): number;
     get groups(): T[];
@@ -81,6 +82,7 @@ export declare abstract class BaseGrid<T extends IGridPanelView> extends Resizab
     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;

package/dist/esm/gridview/baseComponentGridview.js

@@ -4,6 +4,7 @@ import { Disposable } from '../lifecycle';
 import { sequentialNumberGenerator } from '../math';
 import { Sizing } from '../splitview/splitview';
 import { Resizable } from '../resizable';
+import { toggleClass } from '../dom';
 const nextLayoutId = sequentialNumberGenerator();
 export function toTarget(direction) {
     switch (direction) {
@@ -58,6 +59,7 @@ export class BaseGrid extends Resizable {
         this.gridview.locked = value;
     }
     constructor(options) {
+        var _a, _b;
         super(document.createElement('div'), options.disableAutoResizing);
         this._id = nextLayoutId.next();
         this._groups = new Map();
@@ -71,10 +73,12 @@ export class BaseGrid extends Resizable {
         this.onDidLayoutChange = this._bufferOnDidLayoutChange.onEvent;
         this._onDidViewVisibilityChangeMicroTaskQueue = new AsapEvent();
         this.onDidViewVisibilityChangeMicroTaskQueue = this._onDidViewVisibilityChangeMicroTaskQueue.onEvent;
+        this.classNames = [];
         this.element.style.height = '100%';
         this.element.style.width = '100%';
-        if (typeof options.className === 'string') {
-            this.element.classList.add(options.className);
+        this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
+        for (const className of this.classNames) {
+            toggleClass(this.element, className, true);
         }
         options.parentElement.appendChild(this.element);
         this.gridview = new Gridview(!!options.proportionalLayout, options.styles, options.orientation, options.locked, options.margin);
@@ -99,6 +103,18 @@ export class BaseGrid extends Resizable {
     isVisible(panel) {
         return this.gridview.isViewVisible(getGridLocation(panel.element));
     }
+    updateOptions(options) {
+        var _a, _b;
+        if ('className' in options) {
+            for (const className of this.classNames) {
+                toggleClass(this.element, className, false);
+            }
+            this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
+            for (const className of this.classNames) {
+                toggleClass(this.element, className, true);
+            }
+        }
+    }
     maximizeGroup(panel) {
         this.gridview.maximizeView(panel);
         this.doSetGroupActive(panel);

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

@@ -25,11 +25,10 @@ export interface AddComponentOptions<T extends object = Parameters> extends Base
 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;
+    updateOptions(options: Partial<GridviewComponentOptions>): void;
     addPanel<T extends object = Parameters>(options: AddComponentOptions<T>): IGridviewPanel;
     removePanel(panel: IGridviewPanel, sizing?: Sizing): void;
     focus(): void;
@@ -63,7 +62,7 @@ export declare class GridviewComponent extends BaseGrid<GridviewPanel> implement
     get deserializer(): IPanelDeserializer | undefined;
     set deserializer(value: IPanelDeserializer | undefined);
     constructor(parentElement: HTMLElement, options: GridviewComponentOptions);
-    updateOptions(options: Partial<GridviewComponentUpdateOptions>): void;
+    updateOptions(options: Partial<GridviewComponentOptions>): void;
     removePanel(panel: GridviewPanel): void;
     /**
      * Serialize the current state of the layout

package/dist/esm/gridview/gridviewComponent.js

@@ -53,6 +53,7 @@ export class GridviewComponent extends BaseGrid {
         }
     }
     updateOptions(options) {
+        super.updateOptions(options);
         const hasOrientationChanged = typeof options.orientation === 'string' &&
             this.gridview.orientation !== options.orientation;
         this._options = Object.assign(Object.assign({}, this.options), options);

package/dist/esm/paneview/paneviewComponent.d.ts

@@ -103,6 +103,7 @@ export declare class PaneviewComponent extends Resizable implements IPaneviewCom
     readonly onDidAddView: Event<PaneviewPanel>;
     private readonly _onDidRemoveView;
     readonly onDidRemoveView: Event<PaneviewPanel>;
+    private classNames;
     get id(): string;
     get panels(): PaneviewPanel[];
     set paneview(value: Paneview);

package/dist/esm/paneview/paneviewComponent.js

@@ -8,6 +8,7 @@ import { DraggablePaneviewPanel, } from './draggablePaneviewPanel';
 import { DefaultHeader } from './defaultPaneviewHeader';
 import { sequentialNumberGenerator } from '../math';
 import { Resizable } from '../resizable';
+import { toggleClass } from '../dom';
 const nextLayoutId = sequentialNumberGenerator();
 export class PaneFramework extends DraggablePaneviewPanel {
     constructor(options) {
@@ -57,6 +58,7 @@ export class PaneviewComponent extends Resizable {
         return this._options;
     }
     constructor(parentElement, options) {
+        var _a, _b;
         super(parentElement, options.disableAutoResizing);
         this._id = nextLayoutId.next();
         this._disposable = new MutableDisposable();
@@ -71,10 +73,12 @@ export class PaneviewComponent extends Resizable {
         this.onDidAddView = this._onDidAddView.event;
         this._onDidRemoveView = new Emitter();
         this.onDidRemoveView = this._onDidRemoveView.event;
-        if (typeof options.className === 'string') {
-            this.element.classList.add(options.className);
-        }
+        this.classNames = [];
         this.addDisposables(this._onDidLayoutChange, this._onDidLayoutfromJSON, this._onDidDrop, this._onDidAddView, this._onDidRemoveView);
+        this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
+        for (const className of this.classNames) {
+            toggleClass(this.element, className, true);
+        }
         this._options = options;
         if (!options.components) {
             options.components = {};
@@ -96,6 +100,16 @@ export class PaneviewComponent extends Resizable {
         //noop
     }
     updateOptions(options) {
+        var _a, _b;
+        if ('className' in options) {
+            for (const className of this.classNames) {
+                toggleClass(this.element, className, false);
+            }
+            this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
+            for (const className of this.classNames) {
+                toggleClass(this.element, className, true);
+            }
+        }
         this._options = Object.assign(Object.assign({}, this.options), options);
     }
     addPanel(options) {

package/dist/esm/splitview/splitviewComponent.d.ts

@@ -1,5 +1,5 @@
 import { IDisposable } from '../lifecycle';
-import { IView, LayoutPriority, Orientation, Sizing, Splitview } from './splitview';
+import { IView, LayoutPriority, Orientation, Sizing, Splitview, SplitViewOptions } from './splitview';
 import { SplitviewComponentOptions } from './options';
 import { BaseComponentOptions, Parameters } from '../panel/types';
 import { Event } from '../events';
@@ -31,7 +31,6 @@ export interface AddSplitviewComponentOptions<T extends Parameters = Parameters>
     minimumSize?: number;
     maximumSize?: number;
 }
-export type SplitviewComponentUpdateOptions = Pick<SplitviewComponentOptions, 'orientation' | 'components' | 'frameworkComponents'>;
 export interface ISplitviewComponent extends IDisposable {
     readonly minimumSize: number;
     readonly maximumSize: number;
@@ -43,7 +42,7 @@ export interface ISplitviewComponent extends IDisposable {
     readonly onDidRemoveView: Event<IView>;
     readonly onDidLayoutFromJSON: Event<void>;
     readonly panels: SplitviewPanel[];
-    updateOptions(options: Partial<SplitviewComponentUpdateOptions>): void;
+    updateOptions(options: Partial<SplitViewOptions>): void;
     addPanel<T extends object = Parameters>(options: AddSplitviewComponentOptions<T>): ISplitviewPanel;
     layout(width: number, height: number): void;
     onDidLayoutChange: Event<void>;
@@ -73,6 +72,7 @@ export declare class SplitviewComponent extends Resizable implements ISplitviewC
     readonly onDidRemoveView: Event<IView>;
     private readonly _onDidLayoutChange;
     readonly onDidLayoutChange: Event<void>;
+    private classNames;
     get panels(): SplitviewPanel[];
     get options(): SplitviewComponentOptions;
     get length(): number;
@@ -84,7 +84,7 @@ export declare class SplitviewComponent extends Resizable implements ISplitviewC
     get height(): number;
     get width(): number;
     constructor(parentElement: HTMLElement, options: SplitviewComponentOptions);
-    updateOptions(options: Partial<SplitviewComponentUpdateOptions>): void;
+    updateOptions(options: Partial<SplitviewComponentOptions>): void;
     focus(): void;
     movePanel(from: number, to: number): void;
     setVisible(panel: SplitviewPanel, visible: boolean): void;

package/dist/esm/splitview/splitviewComponent.js

@@ -3,6 +3,7 @@ import { Orientation, Sizing, Splitview, } from './splitview';
 import { Emitter } from '../events';
 import { createComponent } from '../panel/componentFactory';
 import { Resizable } from '../resizable';
+import { toggleClass } from '../dom';
 /**
  * A high-level implementation of splitview that works using 'panels'
  */
@@ -45,6 +46,7 @@ export class SplitviewComponent extends Resizable {
             : this.splitview.orthogonalSize;
     }
     constructor(parentElement, options) {
+        var _a, _b;
         super(parentElement, options.disableAutoResizing);
         this._splitviewChangeDisposable = new MutableDisposable();
         this._panels = new Map();
@@ -56,8 +58,10 @@ export class SplitviewComponent extends Resizable {
         this.onDidRemoveView = this._onDidRemoveView.event;
         this._onDidLayoutChange = new Emitter();
         this.onDidLayoutChange = this._onDidLayoutChange.event;
-        if (typeof options.className === 'string') {
-            this.element.classList.add(options.className);
+        this.classNames = [];
+        this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
+        for (const className of this.classNames) {
+            toggleClass(this.element, className, true);
         }
         this._options = options;
         if (!options.components) {
@@ -70,6 +74,16 @@ export class SplitviewComponent extends Resizable {
         this.addDisposables(this._onDidAddView, this._onDidLayoutfromJSON, this._onDidRemoveView, this._onDidLayoutChange);
     }
     updateOptions(options) {
+        var _a, _b;
+        if ('className' in options) {
+            for (const className of this.classNames) {
+                toggleClass(this.element, className, false);
+            }
+            this.classNames = (_b = (_a = options.className) === null || _a === void 0 ? void 0 : _a.split(' ')) !== null && _b !== void 0 ? _b : [];
+            for (const className of this.classNames) {
+                toggleClass(this.element, className, true);
+            }
+        }
         const hasOrientationChanged = typeof options.orientation === 'string' &&
             this.options.orientation !== options.orientation;
         this._options = Object.assign(Object.assign({}, this.options), options);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dockview-core",
-  "version": "1.16.0",
+  "version": "1.16.1",
   "description": "Zero dependency layout manager supporting tabs, grids and splitviews",
   "keywords": [
     "splitview",