### Install WinUI.Dock NuGet package

Source: https://github.com/qian-o/winui.dock/blob/master/README.md

Use the NuGet Package Manager console to add the library to your project.

```nuget
Install-Package WinUI.Dock
```

--------------------------------

### Complex LayoutPanel Structure

Source: https://context7.com/qian-o/winui.dock/llms.txt

An example of a complex layout using nested LayoutPanels to create a multi-pane interface. It demonstrates vertical and horizontal splitting with different panel configurations.

```xaml
<!-- Vertical split with horizontal nested panels -->
<dock:LayoutPanel Orientation="Vertical">
    <!-- Main content area (horizontal split) -->
    <dock:LayoutPanel Orientation="Horizontal">
        <dock:DocumentGroup ShowWhenEmpty="True">
            <dock:Document Title="Editor.xaml" CanClose="True" />
        </dock:DocumentGroup>

        <dock:DocumentGroup Width="250" CompactTabs="True" TabPosition="Bottom">
            <dock:Document Title="Bottom##Properties" CanClose="True" />
        </dock:DocumentGroup>
    </dock:LayoutPanel>

    <!-- Bottom panel area (fixed height) -->
    <dock:LayoutPanel Height="200" Orientation="Horizontal">
        <dock:DocumentGroup TabPosition="Bottom">
            <dock:Document Title="Bottom##Output" CanClose="True" CanPin="True" />
        </dock:DocumentGroup>

        <dock:DocumentGroup CompactTabs="True" TabPosition="Bottom">
            <dock:Document Title="Bottom##Terminal" CanClose="True" CanPin="True" />
        </dock:DocumentGroup>
    </dock:LayoutPanel>
</dock:LayoutPanel>
```

--------------------------------

### Get Parent Document from Child Element

Source: https://context7.com/qian-o/winui.dock/llms.txt

Finds the parent Document control from any child element using the DocumentHelpers utility. Useful for event handling within documents.

```csharp
using WinUI.Dock;

// In XAML: Button with CommandParameter bound to itself
// <Button Command="{x:Bind ViewModel.OpenPropertiesCommand}"
//         CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}}"
//         Content="Open Properties" />

[RelayCommand]
private void OpenProperties(object content)
{
    // Get the parent Document from any child element
    Document? parentDocument = DocumentHelpers.GetDocument(content);

    if (parentDocument != null)
    {
        // Now you can work with the document
        Debug.WriteLine($"Button is inside document: {parentDocument.ActualTitle}");

        // Dock another document relative to this one
        myDocument.DockTo(parentDocument, DockTarget.SplitRight);
    }
}
```

--------------------------------

### Implement IDockAdapter and IDockBehavior

Source: https://github.com/qian-o/winui.dock/blob/master/README.md

Implement these interfaces in your ViewModel to handle document creation, layout logic, and docking events.

```csharp
public partial class MainViewModel : ObservableObject, IDockAdapter, IDockBehavior
{
    private readonly Document propertiesDocument = new()
    {
        Title = "Bottom##Properties",
        Content = "This is a properties document.",
        CanClose = true
    };

    [RelayCommand]
    private void OpenProperties(object content)
    {
        propertiesDocument.Width = 200;
        propertiesDocument.DockTo(DocumentHelpers.GetDocument(content)!, DockTarget.SplitRight);
    }

    void IDockAdapter.OnCreated(Document document)
    {
        document.Content = new TextBlock()
        {
            Text = document.ActualTitle,
            FontSize = 14,
            HorizontalAlignment = HorizontalAlignment.Center,
            VerticalAlignment = VerticalAlignment.Center
        };
    }

    void IDockAdapter.OnCreated(DocumentGroup group, Document? draggedDocument)
    {
        if (draggedDocument?.Title.Contains("Bottom##") is true)
        {
            group.TabPosition = TabPosition.Bottom;
        }
    }

    object? IDockAdapter.GetFloatingWindowTitleBar(Document? draggedDocument)
    {
        return new TextBlock()
        {
            IsHitTestVisible = false,
            Text = "Example Floating Window",
            HorizontalAlignment = HorizontalAlignment.Center,
            VerticalAlignment = VerticalAlignment.Center,
            FontSize = 16,
            FontWeight = FontWeights.Bold
        };
    }

    void IDockBehavior.ActivateMainWindow()
    {
        App.MainWindow.Activate();
    }

    void IDockBehavior.OnDocked(Document src, DockManager dest, DockTarget target)
    {
        Debug.WriteLine($"Document '{src.ActualTitle}' docked to DockManager at target '{target}'.");
    }

    void IDockBehavior.OnDocked(Document src, DocumentGroup dest, DockTarget target)
    {
        Debug.WriteLine($"Document '{src.ActualTitle}' docked to DocumentGroup at target '{target}'.");
    }

    void IDockBehavior.OnFloating(Document document)
    {
        Debug.WriteLine($"Document '{document.ActualTitle}' is now floating.");
    }
}
```

--------------------------------

### Create and Dock a Document Programmatically

Source: https://context7.com/qian-o/winui.dock/llms.txt

Demonstrates how to create a Document control programmatically and dock it relative to another document using the DockTo method. Use the DockTarget enum to specify the docking position.

```csharp
// Create a document programmatically
private readonly Document propertiesDocument = new() 
{
    Title = "Bottom##Properties",     // "Bottom##" prefix for categorization, "Properties" is ActualTitle
    Content = "This is a properties document.",
    CanClose = true,                  // Show close button
    CanPin = true,                    // Show pin button for sidebar docking
    Width = 200,                      // Initial width when docked
    Height = 150                      // Initial height when docked
};

// Dock the document relative to another document
public void OpenPropertiesPanel(object content)
{
    // Get the Document that contains the clicked element
    Document? targetDocument = DocumentHelpers.GetDocument(content);

    if (targetDocument != null)
    {
        propertiesDocument.Width = 200;
        propertiesDocument.DockTo(targetDocument, DockTarget.SplitRight);
    }
}

// DockTarget options:
// - Center: Add to same tab group
// - SplitLeft, SplitTop, SplitRight, SplitBottom: Split the target group
// - DockLeft, DockTop, DockRight, DockBottom: Dock to manager edges
```

--------------------------------

### Implement IDockBehavior Interface

Source: https://context7.com/qian-o/winui.dock/llms.txt

Implement this interface to respond to docking events and manage window activation. It provides callbacks for when documents are docked or become floating.

```csharp
public partial class MainViewModel : ObservableObject, IDockBehavior
{
    void IDockBehavior.ActivateMainWindow()
    {
        // Called when dragging documents to activate the main window
        App.MainWindow.Activate();
    }

    void IDockBehavior.OnDocked(Document src, DockManager dest, DockTarget target)
    {
        // Called when document is docked to the DockManager root
        Debug.WriteLine($"Document '{src.ActualTitle}' docked to DockManager at target '{target}'.");
        // target can be: DockLeft, DockTop, DockRight, DockBottom, Center
    }

    void IDockBehavior.OnDocked(Document src, DocumentGroup dest, DockTarget target)
    {
        // Called when document is docked to a DocumentGroup
        Debug.WriteLine($"Document '{src.ActualTitle}' docked to DocumentGroup at target '{target}'.");
        // target can be: SplitLeft, SplitTop, SplitRight, SplitBottom, Center
    }

    void IDockBehavior.OnFloating(Document document)
    {
        // Called when a document becomes a floating window
        Debug.WriteLine($"Document '{document.ActualTitle}' is now floating.");
    }
}
```

--------------------------------

### Implement IDockAdapter in ViewModel

Source: https://context7.com/qian-o/winui.dock/llms.txt

Use the IDockAdapter interface to customize document creation, group behavior, and floating window title bars.

```csharp
public partial class MainViewModel : ObservableObject, IDockAdapter
{
    void IDockAdapter.OnCreated(Document document)
    {
        // Called when a new Document is created (e.g., during layout load)
        document.Content = new TextBlock()
        {
            Text = document.ActualTitle,
            FontSize = 14,
            HorizontalAlignment = HorizontalAlignment.Center,
            VerticalAlignment = VerticalAlignment.Center
        };
    }

    void IDockAdapter.OnCreated(DocumentGroup group, Document? draggedDocument)
    {
        // Called when a new DocumentGroup is created via drag-drop
        // Use Title prefix pattern like "Bottom##" to categorize documents
        if (draggedDocument?.Title.Contains("Bottom##") is true)
        {
            group.TabPosition = TabPosition.Bottom;
        }
    }

    object? IDockAdapter.GetFloatingWindowTitleBar(Document? draggedDocument)
    {
        // Return custom title bar content for floating windows
        return new TextBlock()
        {
            IsHitTestVisible = false,
            Text = "Custom Floating Window",
            HorizontalAlignment = HorizontalAlignment.Center,
            VerticalAlignment = VerticalAlignment.Center,
            FontSize = 16,
            FontWeight = FontWeights.Bold
        };
    }
}
```

--------------------------------

### Load Dock Layout from JSON

Source: https://context7.com/qian-o/winui.dock/llms.txt

Loads a dock layout from a JSON file using FileOpenPicker. This action clears the current layout before restoring.

```csharp
public partial class MainViewModel : ObservableObject
{
    [RelayCommand]
    private async Task LoadLayout(DockManager manager)
    {
        FileOpenPicker openPicker = new() 
        {
            ViewMode = PickerViewMode.List,
            SuggestedStartLocation = PickerLocationId.DocumentsLibrary,
            FileTypeFilter = { ".json" }
        };

        InitializeWithWindow.Initialize(openPicker, WindowNative.GetWindowHandle(App.MainWindow));

        if (await openPicker.PickSingleFileAsync() is StorageFile file)
        {
            string layoutJson = File.ReadAllText(file.Path);
            // LoadLayout clears current layout and restores from JSON
            // IDockAdapter.OnCreated is called for each restored document
            manager.LoadLayout(layoutJson);
        }
    }
}
```

--------------------------------

### IDockBehavior Interface

Source: https://context7.com/qian-o/winui.dock/llms.txt

The IDockBehavior interface provides callbacks for responding to docking events and managing window activation.

```APIDOC
## IDockBehavior Interface

### Description
The IDockBehavior interface provides callbacks for responding to docking events and managing window activation. Implement this to handle when documents are docked or become floating.

### Methods
- **ActivateMainWindow()**: Called when dragging documents to activate the main window.
- **OnDocked(Document src, DockManager dest, DockTarget target)**: Called when a document is docked to the DockManager root.
- **OnDocked(Document src, DocumentGroup dest, DockTarget target)**: Called when a document is docked to a DocumentGroup.
- **OnFloating(Document document)**: Called when a document becomes a floating window.
```

--------------------------------

### Save Dock Layout to JSON

Source: https://context7.com/qian-o/winui.dock/llms.txt

Saves the current dock layout to a JSON file using FileSavePicker. Requires initialization with the application window.

```csharp
public partial class MainViewModel : ObservableObject
{
    [RelayCommand]
    private async Task SaveLayout(DockManager manager)
    {
        FileSavePicker savePicker = new() 
        {
            SuggestedStartLocation = PickerLocationId.DocumentsLibrary,
            FileTypeChoices = { { "JSON", new List<string> { ".json" } } }
        };

        InitializeWithWindow.Initialize(savePicker, WindowNative.GetWindowHandle(App.MainWindow));

        if (await savePicker.PickSaveFileAsync() is StorageFile file)
        {
            // SaveLayout returns JSON string with complete layout state
            string layoutJson = manager.SaveLayout();
            File.WriteAllText(file.Path, layoutJson);
        }
    }
}
```

--------------------------------

### Configure DockManager in XAML

Source: https://github.com/qian-o/winui.dock/blob/master/README.md

Define the layout structure using DockManager, LayoutPanel, and DocumentGroup components within your view.

```xaml
xmlns:dock="using:WinUI.Dock"

<dock:DockManager x:Name="Manager"
                  Adapter="{Binding}"
                  Behavior="{Binding}">
    <dock:LayoutPanel Orientation="Vertical">
        <dock:LayoutPanel Orientation="Horizontal">
            <dock:DocumentGroup ShowWhenEmpty="True">
                <dock:Document Title="MainView.xaml"
                               CanClose="True">
                    <Button VerticalAlignment="Top"
                            Command="{Binding OpenPropertiesCommand}"
                            CommandParameter="{Binding RelativeSource={RelativeSource Mode=Self}}"
                            Content="Open Properties" />
                </dock:Document>
                <dock:Document Title="MainViewModel.cs"
                               CanClose="True" />
            </dock:DocumentGroup>

            <dock:DocumentGroup Width="200"
                                CompactTabs="True"
                                TabPosition="Bottom">
                <dock:Document Title="Bottom##Solution Explorer"
                               CanClose="True"
                               CanPin="True" />
                <dock:Document Title="Bottom##Git Changes"
                               CanClose="True"
                               CanPin="True" />
            </dock:DocumentGroup>
        </dock:LayoutPanel>

        <dock:LayoutPanel Height="200"
                          Orientation="Horizontal">
            <dock:DocumentGroup TabPosition="Bottom">
                <dock:Document Title="Bottom##Error List"
                               CanClose="True"
                               CanPin="True" />
            </dock:DocumentGroup>

            <dock:DocumentGroup CompactTabs="True"
                                TabPosition="Bottom">
                <dock:Document Title="Bottom##Output"
                               CanClose="True"
                               CanPin="True" />
                <dock:Document Title="Bottom##Terminal"
                               CanClose="True"
                               CanPin="True" />
            </dock:DocumentGroup>
        </dock:LayoutPanel>
    </dock:LayoutPanel>
</dock:DockManager>
```

--------------------------------

### Clear Dock Layout

Source: https://context7.com/qian-o/winui.dock/llms.txt

Resets the dock layout by clearing all documents and floating windows.

```csharp
// Clear all documents and floating windows
public void ResetLayout(DockManager manager)
{
    manager.ClearLayout();
}
```

--------------------------------

### DockTarget Enumeration

Source: https://context7.com/qian-o/winui.dock/llms.txt

Defines possible docking positions for documents relative to a target document or the DockManager. Used with the Document.DockTo() method.

```csharp
public enum DockTarget
{
    Center,       // Add to same tab group as target

    SplitLeft,    // Split target group horizontally, dock to left
    SplitTop,     // Split target group vertically, dock to top
    SplitRight,   // Split target group horizontally, dock to right
    SplitBottom,  // Split target group vertically, dock to bottom

    DockLeft,     // Dock to left edge of DockManager
    DockTop,      // Dock to top edge of DockManager
    DockRight,    // Dock to right edge of DockManager
    DockBottom    // Dock to bottom edge of DockManager
}

// Usage examples:
document.DockTo(targetDocument, DockTarget.Center);      // Join tab group
document.DockTo(targetDocument, DockTarget.SplitRight);  // Split and dock right
document.DockTo(targetDocument, DockTarget.DockBottom);  // Dock to manager bottom
```

--------------------------------

### Tool Window Style Document Group

Source: https://context7.com/qian-o/winui.dock/llms.txt

A DocumentGroup configured for a tool window appearance with tabs at the bottom and compact mode enabled. It also includes properties for width and selected index.

```xaml
<!-- Tool window style with bottom tabs and compact mode -->
<dock:DocumentGroup Width="200"
                    CompactTabs="True"
                    TabPosition="Bottom"
                    SelectedIndex="0">
    <dock:Document Title="Bottom##Solution Explorer"
                   CanClose="True"
                   CanPin="True" />
    <dock:Document Title="Bottom##Git Changes"
                   CanClose="True"
                   CanPin="True" />
</dock:DocumentGroup>
```

--------------------------------

### Standard Document Group in XAML

Source: https://context7.com/qian-o/winui.dock/llms.txt

A standard DocumentGroup control with tabs positioned at the top. It holds multiple Document controls and can be configured to show when empty.

```xaml
<!-- Standard document group with top tabs -->
<dock:DocumentGroup ShowWhenEmpty="True">
    <dock:Document Title="Document1.cs" CanClose="True" />
    <dock:Document Title="Document2.cs" CanClose="True" />
</dock:DocumentGroup>
```

--------------------------------

### Document Control

Source: https://context7.com/qian-o/winui.dock/llms.txt

The Document control represents an individual dockable panel with configurable properties and docking capabilities.

```APIDOC
## Document Control

### Description
The Document control represents an individual dockable panel with a title, content, and configurable close/pin behavior. Documents can be programmatically docked to other documents using the DockTo method.

### Properties
- **Title** (string): The title of the document. Use 'Bottom##' prefix for categorization.
- **Content** (object): The content of the document.
- **CanClose** (bool): Whether the close button is visible.
- **CanPin** (bool): Whether the pin button is visible.
- **Width** (double): Initial width when docked.
- **Height** (double): Initial height when docked.

### Methods
- **DockTo(Document target, DockTarget dockTarget)**: Docks the document relative to another document.

### DockTarget Options
- **Center**: Add to same tab group.
- **SplitLeft, SplitTop, SplitRight, SplitBottom**: Split the target group.
- **DockLeft, DockTop, DockRight, DockBottom**: Dock to manager edges.
```

--------------------------------

### Define DockManager Layout in XAML

Source: https://context7.com/qian-o/winui.dock/llms.txt

The DockManager serves as the root container for managing panels and document groups.

```xaml
xmlns:dock="using:WinUI.Dock"

<dock:DockManager x:Name="Manager"
                  Adapter="{x:Bind ViewModel}"
                  Behavior="{x:Bind ViewModel}">
    <dock:LayoutPanel Orientation="Vertical">
        <dock:LayoutPanel Orientation="Horizontal">
            <dock:DocumentGroup ShowWhenEmpty="True">
                <dock:Document Title="MainView.xaml" CanClose="True">
                    <TextBlock Text="Document content here" />
                </dock:Document>
                <dock:Document Title="MainViewModel.cs" CanClose="True" />
            </dock:DocumentGroup>

            <dock:DocumentGroup Width="200"
                                CompactTabs="True"
                                TabPosition="Bottom">
                <dock:Document Title="Bottom##Solution Explorer"
                               CanClose="True"
                               CanPin="True" />
            </dock:DocumentGroup>
        </dock:LayoutPanel>

        <dock:LayoutPanel Height="200" Orientation="Horizontal">
            <dock:DocumentGroup TabPosition="Bottom">
                <dock:Document Title="Bottom##Error List"
                               CanClose="True"
                               CanPin="True" />
            </dock:DocumentGroup>
        </dock:LayoutPanel>
    </dock:LayoutPanel>
</dock:DockManager>
```

--------------------------------

### Subscribe to Active Document Changes

Source: https://context7.com/qian-o/winui.dock/llms.txt

Subscribes to the ActiveDocumentChanged event of the DockManager to react to changes in the active document. Handles updating UI elements like status bars.

```csharp
public partial class MainView : Page
{
    public MainView()
    {
        InitializeComponent();

        // Subscribe to active document changes
        Manager.ActiveDocumentChanged += OnActiveDocumentChanged;
    }

    private void OnActiveDocumentChanged(object? sender, ActiveDocumentChangedEventArgs e)
    {
        // e.OldDocument - previously active document (may be null)
        // e.NewDocument - newly active document (may be null)

        if (e.NewDocument != null)
        {
            Debug.WriteLine($"Active document changed to: {e.NewDocument.ActualTitle}");
            UpdateStatusBar(e.NewDocument);
        }
    }

    private void UpdateStatusBar(Document doc)
    {
        // Access document properties
        StatusText.Text = $"Editing: {doc.ActualTitle}";
    }
}

// Programmatically set active document
Manager.ActiveDocument = myDocument;
```

--------------------------------

### LayoutPanel Control

Source: https://context7.com/qian-o/winui.dock/llms.txt

The LayoutPanel control arranges child containers in horizontal or vertical orientation with resizable splitters.

```APIDOC
## LayoutPanel Control

### Description
The LayoutPanel control arranges child containers in horizontal or vertical orientation with resizable splitters between them. Nested LayoutPanels create complex multi-pane layouts.

### Properties
- **Orientation** (string): The layout direction (Horizontal or Vertical).
- **Width** (double): Width of the panel.
- **Height** (double): Height of the panel.
```

--------------------------------

### DocumentGroup Control

Source: https://context7.com/qian-o/winui.dock/llms.txt

The DocumentGroup control is a tabbed container that holds multiple Document controls.

```APIDOC
## DocumentGroup Control

### Description
The DocumentGroup control is a tabbed container that holds multiple Document controls. It supports tab position configuration, compact tab mode, and maintains visibility when empty.

### Properties
- **ShowWhenEmpty** (bool): Whether the group remains visible when empty.
- **CompactTabs** (bool): Enables compact tab mode.
- **TabPosition** (string): Position of the tabs (e.g., Top, Bottom).
- **SelectedIndex** (int): The index of the currently selected document.
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.