An instance of BrowserPopout represents a detached native operating system browser
window holding an active layout fragment. Popouts enable true multi-monitor workflows in desktop
web applications, maintaining synchronized state and bidirectional event communication via
layout.eventHub.
// 1. Pop out a specific content item or active stack
const popout = contentItem.popout();
// 2. Access the child layout instance running inside the popup window
const childLayout = popout.getStrelitInstance();
// 3. Access native DOM Window
const popupWin = popout.getWindow();
popupWin.document.title = 'Detached Monitor Window';
// 4. Return to main window layout
popout.popIn();Lifecycle & Features
- Zero Framework Portals Leak: When used with VirtualLayout or portals, component instances can be bound across window boundaries.
- Automatic Pop-In: Users can click the dock/pop-in button in the child window header to seamlessly return the panel to its original position in the master window.
- State Serialization:
layout.saveLayout()captures all active popouts underopenPopouts: PopoutLayoutConfig[], enabling restoration on subsequent page reloads.
getStrelitInstance()
Returns the child LayoutManager instance initialized inside the newly opened
window.
getWindow()
Returns the native browser Window reference backing this popout.
popIn()
Closes the auxiliary window and re-inserts its hosted content item back into its original position within the primary window layout hierarchy.
close()
Closes the popout window without returning its contents to the parent window layout.
toConfig()
Returns a ResolvedPopoutLayoutConfig containing window dimensions (width, height,
left, top), item configuration, and parent restoration identifiers.