chore: code cleanup

packages/dockview-core/src/api/dockviewPanelApi.ts

@@ -69,7 +69,7 @@ export class DockviewPanelApiImpl
     implements DockviewPanelApi
 {
     private _group: DockviewGroupPanel;
-    private _tabComponent: string | undefined;
+    private readonly _tabComponent: string | undefined;
 
     readonly _onDidTitleChange = new Emitter<TitleEvent>();
     readonly onDidTitleChange = this._onDidTitleChange.event;
@@ -131,7 +131,7 @@ export class DockviewPanelApiImpl
     }
 
     constructor(
-        private panel: DockviewPanel,
+        private readonly panel: DockviewPanel,
         group: DockviewGroupPanel,
         private readonly accessor: DockviewComponent,
         component: string,

packages/dockview-core/src/dnd/abstractDragHandler.ts

@@ -1,4 +1,4 @@
-import { disableIframePointEvents, getElementsByTagName } from '../dom';
+import { disableIframePointEvents } from '../dom';
 import { addDisposableListener, Emitter } from '../events';
 import {
     CompositeDisposable,

packages/dockview-core/src/dnd/dnd.ts

@@ -13,8 +13,8 @@ export class DragAndDropObserver extends CompositeDisposable {
     private target: EventTarget | null = null;
 
     constructor(
-        private element: HTMLElement,
-        private callbacks: IDragAndDropObserverCallbacks
+        private readonly element: HTMLElement,
+        private readonly callbacks: IDragAndDropObserverCallbacks
     ) {
         super();
 

packages/dockview-core/src/dockview/components/panel/content.ts

@@ -3,12 +3,7 @@ import {
     IDisposable,
     MutableDisposable,
 } from '../../../lifecycle';
-import {
-    addDisposableListener,
-    addDisposableWindowListener,
-    Emitter,
-    Event,
-} from '../../../events';
+import { Emitter, Event } from '../../../events';
 import { trackFocus } from '../../../dom';
 import { IDockviewPanel } from '../../dockviewPanel';
 import { DockviewComponent } from '../../dockviewComponent';
@@ -33,9 +28,9 @@ export class ContentContainer
     extends CompositeDisposable
     implements IContentContainer
 {
-    private _element: HTMLElement;
+    private readonly _element: HTMLElement;
     private panel: IDockviewPanel | undefined;
-    private disposable = new MutableDisposable();
+    private readonly disposable = new MutableDisposable();
 
     private readonly _onDidFocus = new Emitter<void>();
     readonly onDidFocus: Event<void> = this._onDidFocus.event;

packages/dockview-core/src/dockview/components/tab/defaultTab.ts

@@ -4,9 +4,9 @@ import { addDisposableListener } from '../../../events';
 import { createCloseButton } from '../../../svg';
 
 export class DefaultTab extends CompositeDisposable implements ITabRenderer {
-    private _element: HTMLElement;
-    private _content: HTMLElement;
-    private action: HTMLElement;
+    private readonly _element: HTMLElement;
+    private readonly _content: HTMLElement;
+    private readonly action: HTMLElement;
     private _title: string | undefined;
 
     get element(): HTMLElement {

packages/dockview-core/src/dockview/components/watermark/watermark.ts

@@ -13,7 +13,7 @@ export class Watermark
     extends CompositeDisposable
     implements IWatermarkRenderer
 {
-    private _element: HTMLElement;
+    private readonly _element: HTMLElement;
     private _group: IDockviewGroupPanel | undefined;
     private _api: DockviewApi | undefined;
 

packages/dockview-core/src/dockview/dockviewComponent.ts

@@ -39,7 +39,7 @@ import {
     toTarget,
 } from '../gridview/baseComponentGridview';
 import { DockviewApi } from '../api/component.api';
-import { Orientation, Sizing } from '../splitview/splitview';
+import { Orientation } from '../splitview/splitview';
 import {
     GroupOptions,
     GroupPanelViewState,
@@ -1977,7 +1977,7 @@ export class DockviewComponent
 
                     const newGroup = this.createGroupAtLocation(targetLocation);
                     this.movingLock(() =>
-                        newGroup.model.openPanel(removedPanel!, {
+                        newGroup.model.openPanel(removedPanel, {
                             skipSetActive: true,
                         })
                     );

packages/dockview-core/src/dockview/dockviewGroupPanelModel.ts

@@ -272,7 +272,7 @@ export class DockviewGroupPanelModel
     private _width = 0;
     private _height = 0;
 
-    private _panels: IDockviewPanel[] = [];
+    private readonly _panels: IDockviewPanel[] = [];
     private readonly _panelDisposables = new Map<string, IDisposable>();
 
     private readonly _onMove = new Emitter<GroupMoveEvent>();
@@ -429,7 +429,7 @@ export class DockviewGroupPanelModel
 
     constructor(
         private readonly container: HTMLElement,
-        private accessor: DockviewComponent,
+        private readonly accessor: DockviewComponent,
         public id: string,
         private readonly options: GroupOptions,
         private readonly groupPanel: DockviewGroupPanel

packages/dockview-core/src/dockview/dockviewPanel.ts

@@ -45,10 +45,10 @@ export class DockviewPanel
     private _title: string | undefined;
     private _renderer: DockviewPanelRenderer | undefined;
 
-    private _minimumWidth: number | undefined;
-    private _minimumHeight: number | undefined;
-    private _maximumWidth: number | undefined;
-    private _maximumHeight: number | undefined;
+    private readonly _minimumWidth: number | undefined;
+    private readonly _minimumHeight: number | undefined;
+    private readonly _maximumWidth: number | undefined;
+    private readonly _maximumHeight: number | undefined;
 
     get params(): Parameters | undefined {
         return this._params;

packages/dockview-core/src/dockview/options.ts

@@ -14,7 +14,6 @@ import {
 import { IDockviewPanel } from './dockviewPanel';
 import { DockviewPanelRenderer } from '../overlay/overlayRenderContainer';
 import { IGroupHeaderProps } from './framework';
-import { AnchoredBox } from '../types';
 import { FloatingGroupOptions } from './dockviewComponent';
 import { Contraints } from '../gridview/gridviewPanel';
 

packages/dockview-core/src/dom.ts

@@ -6,6 +6,36 @@ import {
 } from './events';
 import { IDisposable, CompositeDisposable } from './lifecycle';
 
+export interface OverflowEvent {
+    hasScrollX: boolean;
+    hasScrollY: boolean;
+}
+
+export class OverflowObserver extends CompositeDisposable {
+    private readonly _onDidChange = new Emitter<OverflowEvent>();
+    readonly onDidChange = this._onDidChange.event;
+
+    private _value: OverflowEvent | null = null;
+
+    constructor(el: HTMLElement) {
+        super();
+
+        this.addDisposables(
+            this._onDidChange,
+            watchElementResize(el, (entry) => {
+                const hasScrollX =
+                    entry.target.scrollWidth > entry.target.clientWidth;
+
+                const hasScrollY =
+                    entry.target.scrollHeight > entry.target.clientHeight;
+
+                this._value = { hasScrollX, hasScrollY };
+                this._onDidChange.fire(this._value);
+            })
+        );
+    }
+}
+
 export function watchElementResize(
     element: HTMLElement,
     cb: (entry: ResizeObserverEntry) => void
@@ -106,7 +136,7 @@ class FocusTracker extends CompositeDisposable implements IFocusTracker {
     private readonly _onDidBlur = new Emitter<void>();
     public readonly onDidBlur: DockviewEvent<void> = this._onDidBlur.event;
 
-    private _refreshStateHandler: () => void;
+    private readonly _refreshStateHandler: () => void;
 
     constructor(element: HTMLElement | Window) {
         super();

packages/dockview-core/src/gridview/baseComponentGridview.ts

@@ -7,7 +7,7 @@ import { ISplitviewStyles, Orientation, Sizing } from '../splitview/splitview';
 import { IPanel } from '../panel/types';
 import { MovementOptions2 } from '../dockview/options';
 import { Resizable } from '../resizable';
-import { Classnames, toggleClass } from '../dom';
+import { Classnames } from '../dom';
 
 const nextLayoutId = sequentialNumberGenerator();
 

packages/dockview-core/src/gridview/basePanelView.ts

@@ -32,7 +32,7 @@ export abstract class BasePanelView<T extends PanelApiImpl>
 {
     private _height = 0;
     private _width = 0;
-    private _element: HTMLElement;
+    private readonly _element: HTMLElement;
     protected part?: IFrameworkPart;
     protected _params?: PanelInitParameters;
 

packages/dockview-core/src/gridview/branchNode.ts

@@ -19,7 +19,7 @@ import { CompositeDisposable, IDisposable, Disposable } from '../lifecycle';
 
 export class BranchNode extends CompositeDisposable implements IView {
     readonly element: HTMLElement;
-    private splitview: Splitview;
+    private readonly splitview: Splitview;
     private _orthogonalSize: number;
     private _size: number;
     private _childrenDisposable: IDisposable = Disposable.NONE;

packages/dockview-core/src/gridview/leafNode.ts

@@ -17,7 +17,7 @@ export class LeafNode implements IView {
         this._onDidChange.event;
     private _size: number;
     private _orthogonalSize: number;
-    private _disposable: IDisposable;
+    private readonly _disposable: IDisposable;
 
     private get minimumWidth(): number {
         return this.view.minimumWidth;

packages/dockview-core/src/index.ts

@@ -1,4 +1,9 @@
-export * from './dnd/dataTransfer';
+export {
+    getPaneData,
+    getPanelData,
+    PaneTransfer,
+    PanelTransfer,
+} from './dnd/dataTransfer';
 
 /**
  * Events, Emitters and Disposables are very common concepts that many codebases will contain, however we need
@@ -7,14 +12,13 @@ export * from './dnd/dataTransfer';
  */
 export { Emitter as DockviewEmitter, Event as DockviewEvent } from './events';
 export {
-    IDisposable as IDockviewDisposable,
+    IDisposable as DockviewIDisposable,
     MutableDisposable as DockviewMutableDisposable,
     CompositeDisposable as DockviewCompositeDisposable,
     Disposable as DockviewDisposable,
 } from './lifecycle';
 
 export * from './panel/types';
-export * from './panel/componentFactory';
 
 export * from './splitview/splitview';
 export {
@@ -27,7 +31,10 @@ export * from './gridview/gridview';
 export { GridviewComponentOptions } from './gridview/options';
 export * from './gridview/baseComponentGridview';
 
-export * from './paneview/draggablePaneviewPanel';
+export {
+    DraggablePaneviewPanel,
+    PaneviewDropEvent,
+} from './paneview/draggablePaneviewPanel';
 
 export * from './dockview/components/panel/content';
 export * from './dockview/components/tab/tab';
@@ -50,8 +57,11 @@ export {
 
 export * from './dockview/options';
 export * from './dockview/dockviewPanel';
-export * from './dockview/components/tab/defaultTab';
-export * from './dockview/deserializer';
+export { DefaultTab } from './dockview/components/tab/defaultTab';
+export {
+    DefaultDockviewDeserialzier,
+    IPanelDeserializer,
+} from './dockview/deserializer';
 
 export * from './dockview/dockviewComponent';
 export * from './gridview/gridviewComponent';
@@ -60,7 +70,7 @@ export * from './paneview/paneviewComponent';
 export { PaneviewComponentOptions } from './paneview/options';
 
 export * from './gridview/gridviewPanel';
-export * from './splitview/splitviewPanel';
+export { SplitviewPanel, ISplitviewPanel } from './splitview/splitviewPanel';
 export * from './paneview/paneviewPanel';
 export * from './dockview/types';
 

packages/dockview-core/src/overlay/overlay.ts

@@ -45,16 +45,16 @@ class AriaLevelTracker {
 const arialLevelTracker = new AriaLevelTracker();
 
 export class Overlay extends CompositeDisposable {
-    private _element: HTMLElement = document.createElement('div');
+    private readonly _element: HTMLElement = document.createElement('div');
 
     private readonly _onDidChange = new Emitter<void>();
     readonly onDidChange: Event<void> = this._onDidChange.event;
 
     private readonly _onDidChangeEnd = new Emitter<void>();
     readonly onDidChangeEnd: Event<void> = this._onDidChangeEnd.event;
 
-    private static MINIMUM_HEIGHT = 20;
-    private static MINIMUM_WIDTH = 20;
+    private static readonly MINIMUM_HEIGHT = 20;
+    private static readonly MINIMUM_WIDTH = 20;
 
     private verticalAlignment: 'top' | 'bottom' | undefined;
     private horiziontalAlignment: 'left' | 'right' | undefined;

packages/dockview-core/src/paneview/defaultPaneviewHeader.ts

@@ -16,7 +16,9 @@ export class DefaultHeader
     private readonly _element: HTMLElement;
     private readonly _content: HTMLElement;
     private readonly _expander: HTMLElement;
-    private apiRef: { api: PaneviewPanelApiImpl | null } = { api: null };
+    private readonly apiRef: { api: PaneviewPanelApiImpl | null } = {
+        api: null,
+    };
 
     get element(): HTMLElement {
         return this._element;

packages/dockview-core/src/paneview/paneview.ts

@@ -15,10 +15,10 @@ interface PaneItem {
 }
 
 export class Paneview extends CompositeDisposable implements IDisposable {
-    private element: HTMLElement;
-    private splitview: Splitview;
+    private readonly element: HTMLElement;
+    private readonly splitview: Splitview;
     private paneItems: PaneItem[] = [];
-    private _orientation: Orientation;
+    private readonly _orientation: Orientation;
     private animationTimer: any;
     private skipAnimation = false;
 

packages/dockview-core/src/paneview/paneviewComponent.ts

@@ -24,7 +24,7 @@ import { sequentialNumberGenerator } from '../math';
 import { PaneTransfer } from '../dnd/dataTransfer';
 import { Resizable } from '../resizable';
 import { Parameters } from '../panel/types';
-import { Classnames, toggleClass } from '../dom';
+import { Classnames } from '../dom';
 
 const nextLayoutId = sequentialNumberGenerator();
 
@@ -133,8 +133,8 @@ export interface IPaneviewComponent extends IDisposable {
 export class PaneviewComponent extends Resizable implements IPaneviewComponent {
     private readonly _id = nextLayoutId.next();
     private _options: PaneviewComponentOptions;
-    private _disposable = new MutableDisposable();
-    private _viewDisposables = new Map<string, IDisposable>();
+    private readonly _disposable = new MutableDisposable();
+    private readonly _viewDisposables = new Map<string, IDisposable>();
     private _paneview!: Paneview;
 
     private readonly _onDidLayoutfromJSON = new Emitter<void>();

packages/dockview-core/src/paneview/paneviewPanel.ts

@@ -67,9 +67,8 @@ export abstract class PaneviewPanel
     extends BasePanelView<PaneviewPanelApiImpl>
     implements IPaneview, IPaneviewPanel
 {
-    private _onDidChangeExpansionState: Emitter<boolean> = new Emitter<boolean>(
-        { replay: true }
-    );
+    private readonly _onDidChangeExpansionState: Emitter<boolean> =
+        new Emitter<boolean>({ replay: true });
     onDidChangeExpansionState = this._onDidChangeExpansionState.event;
     private readonly _onDidChange = new Emitter<{
         size?: number;
@@ -78,7 +77,7 @@ export abstract class PaneviewPanel
     readonly onDidChange: Event<{ size?: number; orthogonalSize?: number }> =
         this._onDidChange.event;
 
-    private headerSize = 22;
+    private readonly headerSize = 22;
     private _orthogonalSize = 0;
     private _size = 0;
     private _minimumBodySize = 100;