ItemListPanel

A panel that displays a searchable, filterable, multi-selectable list of items with an optional loading overlay, bulk-action toolbar, and pagination footer slot.

Basic usage

<ItemListPanel ItemsSource="{Binding Items}"
              ItemTemplate="{StaticResource ItemTemplate}"
              SearchText="{Binding SearchText, Mode=TwoWay}" />

Properties

Property	Type	Default	Description
IsLoading	bool	false	Whether the loading overlay is shown
LoadingTitle	string	"Loading..."	Title shown in the loading overlay
LoadingSubtitle	string?	—	Subtitle shown in the loading overlay
IsMultiSelectMode	bool	false	Whether multi-select mode is active
SearchText	string?	—	Search/filter text
SearchWatermark	string	"Search..."	Watermark shown in the search box
ItemsSource	IEnumerable?	—	Items source for the list
ItemTemplate	IDataTemplate?	—	Data template for list items
SelectedItem	object?	—	Currently selected item
BulkActionsContent	object?	—	Content shown in the bulk-actions bar (visible in multi-select mode)
FooterContent	object?	—	Content shown in the footer slot (e.g. pagination)
EmptyStateTitle	string	"No items"	Title shown in the empty state
EmptyStateSubtitle	string?	—	Subtitle shown in the empty state
SelectedCount	int	0	Number of selected items in multi-select mode (read-only)

Events

Event	Description
SelectionChanged	Raised when the selected item changes
SearchChanged	Raised when the search text changes

Methods

Method	Description
GetSelectedItems()	Gets all currently selected items (multi-select mode)
SelectAll()	Selects all items
UnselectAll()	Clears all selections
ClearSearch()	Clears the search text

Loading state

Show a loading overlay while data is being fetched:

<ItemListPanel IsLoading="True"
              LoadingTitle="Loading items..."
              LoadingSubtitle="Please wait" />

itemListPanel.IsLoading = true;
// ... load data ...
itemListPanel.IsLoading = false;

Multi-select mode

Enable multi-select mode to allow selecting multiple items:

<ItemListPanel IsMultiSelectMode="True">
    <ItemListPanel.BulkActionsContent>
        <StackPanel Orientation="Horizontal" Spacing="8">
            <Button Content="Delete" />
            <Button Content="Archive" />
        </StackPanel>
    </ItemListPanel.BulkActionsContent>
</ItemListPanel>

itemListPanel.IsMultiSelectMode = true;
var selectedItems = itemListPanel.GetSelectedItems();
itemListPanel.SelectAll();
itemListPanel.UnselectAll();

Searching and filtering

The panel includes a search box that filters items in real-time:

<ItemListPanel SearchWatermark="Filter items..." />

// Set search text programmatically
itemListPanel.SearchText = "search term";

// Clear search
itemListPanel.ClearSearch();

Empty state

When the list is empty, an empty state is displayed automatically. Customize the title and subtitle:

<ItemListPanel EmptyStateTitle="No results found"
              EmptyStateSubtitle="Try a different search term" />

itemListPanel.EmptyStateTitle = "No results found";
itemListPanel.EmptyStateSubtitle = "Try a different search term";

Footer content

Add a footer for pagination or other controls:

<ItemListPanel>
    <ItemListPanel.FooterContent>
        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Spacing="8">
            <Button Content="Previous" />
            <TextBlock Text="Page 1 of 10" />
            <Button Content="Next" />
        </StackPanel>
    </ItemListPanel.FooterContent>
</ItemListPanel>

Selection handling

Handle selection changes:

itemListPanel.SelectionChanged += (sender, e) =>
{
    var selectedItem = itemListPanel.SelectedItem;
    var selectedCount = itemListPanel.SelectedCount;
};