@inject NotificationService NotificationService

<RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" JustifyContent="JustifyContent.Center" Gap="1rem" Wrap="FlexWrap.Wrap" class="rz-p-12">
    <RadzenToggleButton Click=@(args => OnClick("Primary icon button")) Icon="heart_plus" ToggleIcon="favorite" ButtonStyle="ButtonStyle.Primary"
                        Shade="Shade.Light" ToggleShade="Shade.Dark" InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "Primary icon button" }})" />
    <RadzenToggleButton Click=@(args => OnClick("Primary button with text and icon")) Text="Like" Icon="heart_plus" ToggleIcon="favorite" 
        ButtonStyle="ButtonStyle.Primary" Shade="Shade.Light" ToggleShade="Shade.Dark" InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "Primary button with text and icon" }})" />
    <RadzenToggleButton Click=@(args => OnClick("ToggleButton with image")) Image="images/radzen-nuget.png" ButtonStyle="ButtonStyle.Light" Shade="Shade.Light"
                        ToggleShade="Shade.Dark" InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "ToggleButton with image" }})" />
    <RadzenToggleButton Click=@(args => OnClick("ToggleButton with content")) Image="images/radzen-nuget.png" ButtonStyle="ButtonStyle.Light" Shade="Shade.Light"
                        ToggleShade="Shade.Dark" InputAttributes="@(new Dictionary<string,object>(){ { "aria-label", "ToggleButton with content" }})">
        <span class="rz-button-text">ToggleButton with content</span>
        <RadzenImage Path="images/radzen-nuget.png" Style="width: 20px; height: 20px;" class="rz-ms-2" AlternateText="nuget" />
    </RadzenToggleButton>
</RadzenStack>

@code {
    private void OnClick(string text)
    {
        NotificationService.Notify(new NotificationMessage { Severity = NotificationSeverity.Info, Summary = "ToggleButton Clicked", Detail = text });
    }
}