diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts index 778df49d6..847372d8e 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts @@ -3787,4 +3787,37 @@ describe('dockviewComponent', () => { dockview.element.querySelectorAll('.view-container > .view').length ).toBe(0); }); + + test('that api.setSize applies to the overlay for floating panels', () => { + const container = document.createElement('div'); + + const dockview = new DockviewComponent({ + parentElement: container, + components: { + default: PanelContentPartTest, + }, + tabComponents: { + test_tab_id: PanelTabPartTest, + }, + orientation: Orientation.HORIZONTAL, + }); + + dockview.layout(1000, 500); + + const panel1 = dockview.addPanel({ + id: 'panel_1', + component: 'default', + floating: true, + }); + + panel1.api.setSize({ height: 123, width: 256 }); + + const items = dockview.element.querySelectorAll('.dv-resize-container'); + expect(items.length).toBe(1); + + const el = items[0] as HTMLElement; + + expect(el.style.height).toBe('123px'); + expect(el.style.width).toBe('256px'); + }); }); diff --git a/packages/dockview-core/src/dockview/dockviewComponent.ts b/packages/dockview-core/src/dockview/dockviewComponent.ts index d8c64938d..206b42a4e 100644 --- a/packages/dockview-core/src/dockview/dockviewComponent.ts +++ b/packages/dockview-core/src/dockview/dockviewComponent.ts @@ -373,6 +373,12 @@ export class DockviewComponent overlay.onDidChange(() => { this._bufferOnDidLayoutChange.fire(); }), + group.onDidChange((event) => { + overlay.setBounds({ + height: event?.height, + width: event?.width, + }); + }), { dispose: () => { group.model.isFloating = false;