diff --git a/lerna.json b/lerna.json index cdc86ab71..c5d8e732c 100644 --- a/lerna.json +++ b/lerna.json @@ -2,7 +2,7 @@ "packages": [ "packages/*" ], - "version": "4.2.5", + "version": "4.3.1", "npmClient": "yarn", "command": { "publish": { diff --git a/packages/dockview-angular/package.json b/packages/dockview-angular/package.json index 00786e56a..4c7c022b2 100644 --- a/packages/dockview-angular/package.json +++ b/packages/dockview-angular/package.json @@ -1,6 +1,6 @@ { "name": "dockview-angular", - "version": "4.2.5", + "version": "4.3.1", "description": "Zero dependency layout manager supporting tabs, grids and splitviews", "keywords": [ "splitview", @@ -54,6 +54,6 @@ "test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview --coverage" }, "dependencies": { - "dockview-core": "^4.2.5" + "dockview-core": "^4.3.1" } } diff --git a/packages/dockview-core/package.json b/packages/dockview-core/package.json index bf05da540..66cc83c16 100644 --- a/packages/dockview-core/package.json +++ b/packages/dockview-core/package.json @@ -1,6 +1,6 @@ { "name": "dockview-core", - "version": "4.2.5", + "version": "4.3.1", "description": "Zero dependency layout manager supporting tabs, grids and splitviews", "keywords": [ "splitview", diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts index 8f72affee..1ef2c8f4c 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts @@ -5597,6 +5597,67 @@ describe('dockviewComponent', () => { expect(dockview.groups.length).toBe(0); }); + test('popout single panel -> save layout -> load layout', async () => { + const container = document.createElement('div'); + + window.open = () => setupMockWindow(); + + const dockview = new DockviewComponent(container, { + createComponent(options) { + switch (options.name) { + case 'default': + return new PanelContentPartTest( + options.id, + options.name + ); + default: + throw new Error(`unsupported`); + } + }, + }); + + dockview.layout(1000, 500); + + const panel1 = dockview.addPanel({ + id: 'panel_1', + component: 'default', + }); + + const panel2 = dockview.addPanel({ + id: 'panel_2', + component: 'default', + }); + + const panel3 = dockview.addPanel({ + id: 'panel_3', + component: 'default', + }); + + const panel4 = dockview.addPanel({ + id: 'panel_4', + component: 'default', + position: { direction: 'right' }, + }); + + expect(dockview.panels.length).toBe(4); + expect(dockview.groups.length).toBe(2); + + expect(await dockview.addPopoutGroup(panel1)).toBeTruthy(); + + expect(dockview.panels.length).toBe(4); + expect(dockview.groups.length).toBe(3); + + expect(panel1.api.location.type).toBe('popout'); + + dockview.fromJSON(dockview.toJSON()); + + await new Promise((resolve) => setTimeout(resolve, 0)); // popout views are completed as a promise so must complete microtask-queue + + expect(dockview.panels.length).toBe(4); + expect(dockview.groups.length).toBe(3); + expect(dockview.groups.every((g) => g.api.isVisible)).toBeTruthy(); + }); + test('move from fixed to popout group and back', async () => { const container = document.createElement('div'); diff --git a/packages/dockview-core/src/__tests__/events.spec.ts b/packages/dockview-core/src/__tests__/events.spec.ts index d4b4fb00b..301feb362 100644 --- a/packages/dockview-core/src/__tests__/events.spec.ts +++ b/packages/dockview-core/src/__tests__/events.spec.ts @@ -1,9 +1,4 @@ -import { - AsapEvent, - Emitter, - Event, - addDisposableListener, -} from '../events'; +import { AsapEvent, Emitter, Event, addDisposableListener } from '../events'; describe('events', () => { describe('emitter', () => { @@ -67,7 +62,7 @@ describe('events', () => { expect(value).toBeUndefined(); }); - it('should relay last value in replay mode', () => { + it('should replay last value in replay mode', () => { const emitter = new Emitter({ replay: true }); let value: number | undefined = undefined; @@ -80,6 +75,20 @@ describe('events', () => { stream.dispose(); }); + + it('should not replay last value in replay mode', () => { + const emitter = new Emitter(); + let value: number | undefined = undefined; + + emitter.fire(1); + + const stream = emitter.event((x) => { + value = x; + }); + expect(value).toBeUndefined(); + + stream.dispose(); + }); }); describe('asapEvent', () => { diff --git a/packages/dockview-core/src/dnd/droptarget.ts b/packages/dockview-core/src/dnd/droptarget.ts index c611f890b..f017fbdf9 100644 --- a/packages/dockview-core/src/dnd/droptarget.ts +++ b/packages/dockview-core/src/dnd/droptarget.ts @@ -168,10 +168,10 @@ export class Droptarget extends CompositeDisposable { onDragOver: (e) => { Droptarget.ACTUAL_TARGET = this; - const overrideTraget = this.options.getOverrideTarget?.(); + const overrideTarget = this.options.getOverrideTarget?.(); if (this._acceptedTargetZonesSet.size === 0) { - if (overrideTraget) { + if (overrideTarget) { return; } this.removeDropTarget(); @@ -214,7 +214,7 @@ export class Droptarget extends CompositeDisposable { } if (!this.options.canDisplayOverlay(e, quadrant)) { - if (overrideTraget) { + if (overrideTarget) { return; } this.removeDropTarget(); @@ -239,7 +239,7 @@ export class Droptarget extends CompositeDisposable { this.markAsUsed(e); - if (overrideTraget) { + if (overrideTarget) { // } else if (!this.targetElement) { this.targetElement = document.createElement('div'); diff --git a/packages/dockview-core/src/dockview/components/titlebar/voidContainer.ts b/packages/dockview-core/src/dockview/components/titlebar/voidContainer.ts index 29e31b9b6..2f15a9499 100644 --- a/packages/dockview-core/src/dockview/components/titlebar/voidContainer.ts +++ b/packages/dockview-core/src/dockview/components/titlebar/voidContainer.ts @@ -13,7 +13,7 @@ import { DockviewGroupPanelModel } from '../../dockviewGroupPanelModel'; export class VoidContainer extends CompositeDisposable { private readonly _element: HTMLElement; - private readonly dropTraget: Droptarget; + private readonly dropTarget: Droptarget; private readonly _onDrop = new Emitter(); readonly onDrop: Event = this._onDrop.event; @@ -48,7 +48,7 @@ export class VoidContainer extends CompositeDisposable { const handler = new GroupDragHandler(this._element, accessor, group); - this.dropTraget = new Droptarget(this._element, { + this.dropTarget = new Droptarget(this._element, { acceptedTargetZones: ['center'], canDisplayOverlay: (event, position) => { const data = getPanelData(); @@ -66,17 +66,17 @@ export class VoidContainer extends CompositeDisposable { getOverrideTarget: () => group.model.dropTargetContainer?.model, }); - this.onWillShowOverlay = this.dropTraget.onWillShowOverlay; + this.onWillShowOverlay = this.dropTarget.onWillShowOverlay; this.addDisposables( handler, handler.onDragStart((event) => { this._onDragStart.fire(event); }), - this.dropTraget.onDrop((event) => { + this.dropTarget.onDrop((event) => { this._onDrop.fire(event); }), - this.dropTraget + this.dropTarget ); } } diff --git a/packages/dockview-core/src/dockview/dockviewComponent.ts b/packages/dockview-core/src/dockview/dockviewComponent.ts index 2bed69abd..d83ed7923 100644 --- a/packages/dockview-core/src/dockview/dockviewComponent.ts +++ b/packages/dockview-core/src/dockview/dockviewComponent.ts @@ -116,6 +116,7 @@ export interface DockviewPopoutGroupOptions { * Defaults to `/popout.html` if not provided */ popoutUrl?: string; + referenceGroup?: DockviewGroupPanel; onDidOpen?: (event: { id: string; window: Window }) => void; onWillClose?: (event: { id: string; window: Window }) => void; overridePopoutGroup?: DockviewGroupPanel; @@ -329,7 +330,7 @@ export class DockviewComponent private readonly _onDidActivePanelChange = new Emitter< IDockviewPanel | undefined - >(); + >({ replay: true }); readonly onDidActivePanelChange: Event = this._onDidActivePanelChange.event; @@ -1510,18 +1511,14 @@ export class DockviewComponent const group = createGroupFromSerializedState(data); - this.addPopoutGroup( - (gridReferenceGroup + this.addPopoutGroup(group, { + position: position ?? undefined, + overridePopoutGroup: gridReferenceGroup ? group : undefined, + referenceGroup: gridReferenceGroup ? this.getPanel(gridReferenceGroup) - : undefined) ?? group, - { - position: position ?? undefined, - overridePopoutGroup: gridReferenceGroup - ? group - : undefined, - popoutUrl: url, - } - ); + : undefined, + popoutUrl: url, + }); } for (const floatingGroup of this._floatingGroups) { diff --git a/packages/dockview-core/src/events.ts b/packages/dockview-core/src/events.ts index b7e2821c6..b863b2acb 100644 --- a/packages/dockview-core/src/events.ts +++ b/packages/dockview-core/src/events.ts @@ -160,7 +160,9 @@ export class Emitter implements IDisposable { } public fire(e: T): void { - this._last = e; + if(this.options?.replay){ + this._last = e; + } for (const listener of this._listeners) { listener.callback(e); } diff --git a/packages/dockview-react/package.json b/packages/dockview-react/package.json index 6637767f3..ef56b7e36 100644 --- a/packages/dockview-react/package.json +++ b/packages/dockview-react/package.json @@ -1,6 +1,6 @@ { "name": "dockview-react", - "version": "4.2.5", + "version": "4.3.1", "description": "Zero dependency layout manager supporting tabs, grids and splitviews", "keywords": [ "splitview", @@ -54,6 +54,6 @@ "test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-react --coverage" }, "dependencies": { - "dockview": "^4.2.5" + "dockview": "^4.3.1" } } diff --git a/packages/dockview-vue/package.json b/packages/dockview-vue/package.json index db0480c0b..652e1010a 100644 --- a/packages/dockview-vue/package.json +++ b/packages/dockview-vue/package.json @@ -1,6 +1,6 @@ { "name": "dockview-vue", - "version": "4.2.5", + "version": "4.3.1", "description": "Zero dependency layout manager supporting tabs, grids and splitviews", "keywords": [ "splitview", @@ -52,7 +52,7 @@ "test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview-vue --coverage" }, "dependencies": { - "dockview-core": "^4.2.5" + "dockview-core": "^4.3.1" }, "peerDependencies": { "vue": "^3.4.0" diff --git a/packages/dockview/package.json b/packages/dockview/package.json index 11c3cff1f..fe213fcf5 100644 --- a/packages/dockview/package.json +++ b/packages/dockview/package.json @@ -1,6 +1,6 @@ { "name": "dockview", - "version": "4.2.5", + "version": "4.3.1", "description": "Zero dependency layout manager supporting tabs, grids and splitviews", "keywords": [ "splitview", @@ -54,7 +54,7 @@ "test:cov": "cross-env ../../node_modules/.bin/jest --selectProjects dockview --coverage" }, "dependencies": { - "dockview-core": "^4.2.5" + "dockview-core": "^4.3.1" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" diff --git a/packages/docs/blog/2025-06-03-dockview-4.3.0.md b/packages/docs/blog/2025-06-03-dockview-4.3.0.md new file mode 100644 index 000000000..33e901e78 --- /dev/null +++ b/packages/docs/blog/2025-06-03-dockview-4.3.0.md @@ -0,0 +1,21 @@ +--- +slug: dockview-4.3.0-release +title: Dockview 4.3.0 +tags: [release] +--- + +# Release Notes + +Please reference docs @ [dockview.dev](https://dockview.dev). + +## 🚀 Features + +- Hide group private methods from public API [#925](https://github.com/mathuo/dockview/pull/925) + +## 🛠 Miscs + +- Bug: Fix the restoring of popout groups from layout [#933](https://github.com/mathuo/dockview/pull/933) +- Internals: Variable name typo [#940](https://github.com/mathuo/dockview/pull/940) + +## 🔥 Breaking changes + diff --git a/packages/docs/blog/2025-06-05-dockview-4.3.1.md b/packages/docs/blog/2025-06-05-dockview-4.3.1.md new file mode 100644 index 000000000..4c700d3ad --- /dev/null +++ b/packages/docs/blog/2025-06-05-dockview-4.3.1.md @@ -0,0 +1,18 @@ +--- +slug: dockview-4.3.1-release +title: Dockview 4.3.1 +tags: [release] +--- + +# Release Notes + +Please reference docs @ [dockview.dev](https://dockview.dev). + +## 🚀 Features + +## 🛠 Miscs + +- Internal: Improve GC cleanup by only retaining previously emitted event values when event is in replay mode [#947](https://github.com/mathuo/dockview/pull/947) + +## 🔥 Breaking changes + diff --git a/packages/docs/package.json b/packages/docs/package.json index cef847aae..e0aae112b 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -1,6 +1,6 @@ { "name": "dockview-docs", - "version": "4.2.5", + "version": "4.3.1", "private": true, "scripts": { "build": "npm run build-templates && docusaurus build", @@ -38,7 +38,7 @@ "ag-grid-react": "^31.0.2", "axios": "^1.6.3", "clsx": "^2.1.0", - "dockview": "^4.2.5", + "dockview": "^4.3.1", "prism-react-renderer": "^2.3.1", "react-dnd": "^16.0.1", "react-laag": "^2.0.5", diff --git a/packages/docs/src/pages/index.tsx b/packages/docs/src/pages/index.tsx index 4a4b8b1dd..9f7d03477 100644 --- a/packages/docs/src/pages/index.tsx +++ b/packages/docs/src/pages/index.tsx @@ -19,7 +19,7 @@ export default function Home(): JSX.Element {

Fully Featured Docking Layout Manager

- Zero dependency layout managment and docking + Zero dependency layout management and docking controls