@page "/dropdown-grouping"

<RadzenText TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    DropDown <strong>grouping</strong>
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Organize dropdown items into categories with group headers.
</RadzenText>

<RadzenText TextStyle="TextStyle.Subtitle2" TagName="TagName.P" class="rz-pb-4">
    In this demo <strong>Orders</strong> are grouped by <strong>Company Name</strong> using <code>ItemRender</code> to make group headers bold and non-selectable with indented order items showing OrderID and Order Date.
</RadzenText>

<RadzenExample ComponentName="DropDown" Example="DropDownGrouping">
    <DropDownGrouping />
</RadzenExample>

<RadzenText Anchor="dropdown-grouping#multiple-selection" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8 rz-mb-6">
    DropDown <strong>grouping</strong> with multiple selection
</RadzenText>
<RadzenExample ComponentName="DropDown" Example="DropDownGroupingMultiSelect">
    <DropDownGroupingMultiSelect />
</RadzenExample>