feat(dockview-core): floating & popout windows as nested (multi-group) layouts#1310
Open
mathuo wants to merge 7 commits into
Open
feat(dockview-core): floating & popout windows as nested (multi-group) layouts#1310mathuo wants to merge 7 commits into
mathuo wants to merge 7 commits into
Conversation
18 tasks
Introduce the multi-root foundation: a DockviewComponent can host more than one gridview root (the main grid plus, now, floating windows), all sharing one groups map, panel registry, DnD transfer namespace and serialization — so there is still a single public DockviewApi and existing behaviour is unchanged. - a floating window mounts its own Gridview as the overlay content; the anchor group is added into it, and further groups can be split in - getGridviewForGroup resolves a group's owning root; doAddGroup / createGroupAtLocation take a target gridview; moveGroup(OrPanel) compute locations against the destination root, so panels/groups can be dragged across the main<->floating boundary (and floating<->floating) - floating groups accept all drop zones (edge drop splits the window); doRemoveGroup is multi-group aware (detach one group, keep the window alive) - serialize/restore each floating window's nested gridview (legacy single-group shape preserved for byte-stable round-trips) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Extend the multi-root model to popout windows: a popout hosts its own Gridview (in the popout document, with its own overlay render + drop-target containers), so it can hold a nested splitview of groups and participate in cross-boundary drag-and-drop just like floating windows. - popout groups accept all drop zones; moveGroup(OrPanel) and doRemoveGroup are popout-root aware (split into a popout, drag in/out, multi-group windows) - getOverrideTarget resolves dynamically so a relocated group's drop overlay mounts in the correct window - serialize/restore the popout's nested gridview (legacy single-group shape preserved); restore rebuilds it via an internal override - size + reposition the popout via a ResizeObserver created in the popout window's own realm, so content lays out at the real size once the window has painted (a parent-realm observer / fixed animation-frame count raced) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Harden the restore path against real-world popout edge cases surfaced by loading saved layouts: - when the browser blocks a popout window (window.open returns null — common when restoring on load), dock the group into the grid (or return its panels and dispose the empty group) instead of leaving an orphan; blocked content falls back into the grid rather than being lost - dispose 'grid'-location groups whose element isn't actually in the gridview (a popout-destined group swept up by a re-entrant fromJSON / clear) instead of throwing "Invalid grid element" Adds regression tests for blocked-popup restoration and rapid repeated fromJSON. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Three fixes from reviewing the nested floating/popout layout work: 1. The dedicated floating title bar (default floatingGroupDragHandle: 'titlebar') captured its anchor group permanently, so after the original anchor was dragged out of a surviving multi-group window the bar still redocked/activated the departed group. GroupDragSource.group now accepts a provider resolved lazily; FloatingTitleBar holds a mutable anchor with setGroup(); DockviewFloatingGroupPanel.setAnchorGroup retargets it; onWillDragGroup fires the live anchor. 2. Nested floating/popout gridview gap was not updated on runtime theme change; updateTheme now syncs .margin on every nested gridview. 3. Multi-group popout restore while popups are blocked orphaned the non-anchor members; the blocked fallback now docks every member into the main grid. Adds regression tests for (1) and (3). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…ockviewComponent The floating-nested-layout work concentrated a lot of logic in a few giant methods. Extract cohesive units (no behaviour change; full suite green): - addPopoutGroup (582→~378): handleBlockedPopout, disposePopoutWindow, redockGroupToMainGrid - detach cascade: detachFromNestedWindow unifies the float/popout multi-member detach + anchor-reassign previously duplicated in doRemoveGroup and moveGroup; add disposeGroupRecord and activateFallbackGroupIfRemoved - fromJSON (449→~249): deserializeEdgeGroups/FloatingWindows/PopoutWindows and shared deserializeNestedGridview - move popout ResizeObserver mechanics into PopoutWindowService.observeGridviewSize Grid-manipulating orchestration stays in the component; services keep their narrow host interface. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
mathuo
force-pushed
the
feat/floating-nested-layout
branch
from
9a239a5 to
d6ce3ab
Compare
mathuo
changed the title
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Makes floating and popout windows full multi-group layouts, and tidies the
dockviewComponent.tsmethods that grew as a result. All changes are indockview-core.1. Floating & popout windows as nested layouts (multi-root)
Floating and popout windows previously hosted a single group. They now host their own
Gridview, so:toJSON()/fromJSON()round-trip multi-group floating and popout windows.fromJSON(members are re-docked into the main grid rather than left as orphans).2.
dockviewComponent.tsreadability refactorThe methods that grew with the nested-layout work were decomposed in-place into well-named private helpers, and the previously-triplicated float/popout "multi-member detach + anchor reassignment" cascade was unified into a single
detachFromNestedWindow(plusdisposeGroupRecord/activateFallbackGroupIfRemoved). No behaviour change.Type of change
Affected packages
dockview-coredockview(vanilla JS)dockview-reactdockview-vuedockview-angulardocsHow to test
yarn testindockview-core— 1023 tests pass (suite expanded with multi-group floating/popout coverage indockviewComponent.spec.ts).toJSON()→ reloadfromJSON()and confirm the multi-root layout (including popouts) restores.Checklist
yarn lint:fixpassesyarn formatpassesnpm run genhas been run and generated files are up to dateyarn testpasses