Active panel object.
All group objects.
Height of the component.
The unique identifier for this instance. Used to manage scope of Drag'n'Drop events.
Maximum height of the component.
Maximum width of the component.
Minimum height of the component.
Minimum width of the component.
Invoked when the active group changes. May be undefined if no group is active.
Invoked when the active panel changes. The event carries the active
panel (may be undefined if no panel is active) and the
DockviewOrigin ('user' vs 'api') of the change.
Invoked when a group is added. May be called multiple times when moving groups.
Invoked when a panel is added. May be called multiple times when moving panels.
Invoked when a panel is added to a tab group.
Fires when a popout group successfully opens in its own window, carrying
the live Window handle. Use it to route focus or attach per-document
listeners. Enumerate the current popouts at any time with getPopouts().
Invoked when a tab group is created in any group.
Invoked when a tab group is destroyed in any group.
Invoked when a Drag'n'Drop event occurs that the component was unable to handle. Exposed for custom Drag'n'Drop functionality.
Invoked when any layout change occures, an aggregation of many events.
Invoked after a layout is deserialzied using the fromJSON method.
Fires after each top-level structural layout mutation. See onWillMutateLayout.
Invoked when a group is removed. May be called multiple times when moving groups.
Invoked when a panel is removed. May be called multiple times when moving panels.
Invoked when a panel is removed from a tab group.
Fires when a popout group is removed — whether the user closed its window or it was docked back programmatically. Symmetric with onDidAddPopoutGroup; not fired during component disposal.
Invoked when a tab group's properties (label, color) change.
Invoked when a tab group is collapsed or expanded.
Invoked before a group is dragged.
Calling event.nativeEvent.preventDefault() will prevent the group drag starting.
Invoked before a panel is dragged.
Calling event.nativeEvent.preventDefault() will prevent the panel drag starting.
Invoked when a Drag'n'Drop event occurs but before dockview handles it giving the user an opportunity to intecept and
prevent the event from occuring using the standard preventDefault() syntax.
Preventing certain events may causes unexpected behaviours, use carefully.
Fires before each top-level structural layout mutation (add / remove /
move / float / popout / maximize / load / clear). Compound operations
(e.g. a drag) fire once. Pair with onDidMutateLayout to bracket a
change — useful for undo/redo, autosave and dirty-tracking.
Invoked before an overlay is shown indicating a drop target.
Calling event.preventDefault() will prevent the overlay being shown and prevent
the any subsequent drop event.
All panel objects.
Total number of groups.
The active tab-group color palette. Reflects the configured
tabGroupColors option, or the built-in defaults when unset.
Useful for custom chip renderers that want to roll their own
picker UI.
Total number of panels.
Width of the component.
Add an edge group at the given position. Returns the group panel API for the newly created group. Throws if a group already exists there.
Add a floating group
Optionaloptions: FloatingGroupOptionsAdd a group and return the created object.
Optionaloptions: AddGroupOptionsAdd a panel and return the created object.
Add a popout group in a new Window
Optionaloptions: DockviewPopoutGroupOptionsThe nearest grid group in a spatial direction from group, comparing
group centre points — e.g. the group visually to the left. Floating and
popout groups are ignored. Returns undefined when there is no group in
that direction. Pair with group.api.boundingBox to build your own
spatial navigation.
Reset the component back to an empty and default state.
Close all groups and panels.
Release resources and teardown component. Do not call when using framework versions of dockview.
Focus the component. Will try to focus an active panel if one exists.
Create a component from a serialized object.
Optionaloptions: { reuseExistingPanels: boolean }Get the group panel API for an edge group at the given position.
Returns undefined if no edge group is configured at that position.
Get a group object given a string id. May return undefined.
Get a panel object given a string id. May return undefined.
Enumerate the popout groups currently open in their own windows.
Check whether an edge group is currently visible.
Force resize the component to an exact width and height. Read about auto-resizing before using.
Move the focus progmatically to the next panel or group.
Optionaloptions: MovementOptionsMove the focus progmatically to the previous panel or group.
Optionaloptions: MovementOptionsRemove an edge group and reclaim its slot in the layout. All panels inside the group are disposed. Throws if no group exists at position.
Set the visibility of an edge group.
Create a serialized object of the current component.
Active group object.