feat: add close button.

demo/Ursa.Demo/Pages/ToastDemo.axaml

@@ -12,6 +12,7 @@
         <vm:ToastDemoViewModel />
     </Design.DataContext>
     <StackPanel>
+        <ToggleSwitch IsChecked="{Binding ShowClose}" Content="ShowClose"/>
         <StackPanel Orientation="Horizontal" Spacing="20">
             <Button Command="{Binding ShowNormal}" CommandParameter="{Binding $self.Content}" Content="Information" />
             <Button Command="{Binding ShowNormal}" CommandParameter="{Binding $self.Content}" Content="Success" Classes="Success" />

demo/Ursa.Demo/ViewModels/ToastDemoViewModel.cs

@@ -10,6 +10,9 @@ public partial class ToastDemoViewModel : ObservableObject
 {
     public WindowToastManager? ToastManager { get; set; }
 
+    [ObservableProperty]
+    private bool _showClose = true;
+
     [RelayCommand]
     public void ShowNormal(object obj)
     {
@@ -18,6 +21,7 @@ public partial class ToastDemoViewModel : ObservableObject
             Enum.TryParse<NotificationType>(s, out var notificationType);
             ToastManager?.Show(
                 new Toast("This is message"),
+                showClose: ShowClose,
                 type: notificationType);
         }
 
@@ -36,6 +40,7 @@ public partial class ToastDemoViewModel : ObservableObject
             Enum.TryParse<NotificationType>(s, out var notificationType);
             ToastManager?.Show(
                 new Toast("This is message"),
+                showClose: ShowClose,
                 type: notificationType,
                 classes: ["Light"]);
         }

src/Ursa.Themes.Semi/Controls/Toast.axaml

@@ -3,17 +3,12 @@
                     xmlns:u="https://irihi.tech/ursa">
     <Design.PreviewWith>
         <ThemeVariantScope RequestedThemeVariant="Dark">
-            <StackPanel>
+            <StackPanel Orientation="Horizontal">
+                <u:ToastCard ShowClose="False" />
                 <u:ToastCard>
                     Hello, Semi.Avalonia!
                 </u:ToastCard>
-                <u:ToastCard NotificationType="Success">
+                <u:ToastCard NotificationType="Success" ShowClose="False">
-                    <u:Toast Content="Hello, Semi.Avalonia!" />
-                </u:ToastCard>
-                <u:ToastCard NotificationType="Warning">
-                    <u:Toast Content="Hello, Semi.Avalonia!" />
-                </u:ToastCard>
-                <u:ToastCard NotificationType="Error">
                     <u:Toast Content="Hello, Semi.Avalonia!" />
                 </u:ToastCard>
             </StackPanel>
@@ -35,7 +30,6 @@
 
     <ControlTheme x:Key="{x:Type u:ToastCard}" TargetType="u:ToastCard">
         <Setter Property="UseLayoutRounding" Value="True" />
-        <Setter Property="MinWidth" Value="{DynamicResource NotificationCardMinWidth}" />
         <Setter Property="RenderTransformOrigin" Value="50%,75%" />
         <Setter Property="BorderThickness" Value="{DynamicResource NotificationCardBorderThickness}" />
         <Setter Property="BorderBrush" Value="{DynamicResource NotificationCardBorderBrush}" />
@@ -53,40 +47,44 @@
                             Padding="{DynamicResource NotificationCardPadding}"
                             BoxShadow="{DynamicResource NotificationCardBoxShadow}"
                             BorderBrush="{TemplateBinding BorderBrush}"
+                            VerticalAlignment="Stretch"
                             BorderThickness="{TemplateBinding BorderThickness}"
                             CornerRadius="{TemplateBinding CornerRadius}">
-                            <DockPanel>
+                            <StackPanel Orientation="Horizontal">
                                 <PathIcon
                                     Name="NotificationIcon"
                                     Width="{DynamicResource NotificationCardIconWidth}"
                                     Height="{DynamicResource NotificationCardIconHeight}"
                                     Margin="{DynamicResource NotificationCardIconMargin}"
-                                    VerticalAlignment="Top"
                                     IsVisible="False"
                                     Data="{DynamicResource NotificationCardInformationIconPathData}" />
                                 <ContentControl
                                     Name="PART_Content"
+                                    Margin="12 0"
+                                    VerticalContentAlignment="Center"
                                     Content="{TemplateBinding Content}">
                                     <ContentControl.DataTemplates>
                                         <DataTemplate DataType="u:IToast">
                                             <SelectableTextBlock
-                                                Foreground="{DynamicResource NotificationCardMessageForeground}"
+                                                Foreground="{DynamicResource NotificationCardTitleForeground}"
-                                                FontSize="{DynamicResource NotificationCardMessageFontSize}"
+                                                FontWeight="{DynamicResource NotificationCardTitleFontWeight}"
-                                                FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
                                                 Text="{Binding Content}"
                                                 TextWrapping="Wrap" />
                                         </DataTemplate>
                                         <DataTemplate DataType="x:String">
                                             <SelectableTextBlock
-                                                Foreground="{DynamicResource NotificationCardMessageForeground}"
+                                                Foreground="{DynamicResource NotificationCardTitleForeground}"
-                                                FontSize="{DynamicResource NotificationCardMessageFontSize}"
+                                                FontWeight="{DynamicResource NotificationCardTitleFontWeight}"
-                                                FontWeight="{DynamicResource NotificationCardMessageFontWeight}"
                                                 Text="{Binding}"
                                                 TextWrapping="Wrap" />
                                         </DataTemplate>
                                     </ContentControl.DataTemplates>
                                 </ContentControl>
-                            </DockPanel>
+                                <Button
+                                    Theme="{StaticResource ToastCloseButton}"
+                                    IsVisible="{TemplateBinding ShowClose}"
+                                    u:ToastCard.CloseOnClick="True" />
+                            </StackPanel>
                         </Border>
                     </Border>
                 </LayoutTransformControl>
@@ -193,4 +191,31 @@
             </Style>
         </Style>
     </ControlTheme>
+
+    <ControlTheme x:Key="ToastCloseButton" TargetType="Button">
+        <Setter Property="CornerRadius" Value="6" />
+        <Setter Property="Height" Value="24" />
+        <Setter Property="Width" Value="24" />
+        <Setter Property="Cursor" Value="Hand" />
+        <Setter Property="Template">
+            <ControlTemplate TargetType="Button">
+                <Border
+                    Name="PART_Border"
+                    Padding="{TemplateBinding Padding}"
+                    Background="Transparent"
+                    CornerRadius="{TemplateBinding CornerRadius}">
+                    <PathIcon
+                        Width="10"
+                        Height="10"
+                        Data="{DynamicResource WindowCloseIconGlyph}" />
+                </Border>
+            </ControlTemplate>
+        </Setter>
+        <Style Selector="^:pointerover /template/ Border">
+            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPointeroverBackground}" />
+        </Style>
+        <Style Selector="^:pressed /template/ Border">
+            <Setter Property="Background" Value="{DynamicResource ButtonDefaultPressedBackground}" />
+        </Style>
+    </ControlTheme>
 </ResourceDictionary>

src/Ursa/Controls/Toast/IToast.cs

@@ -20,6 +20,11 @@ public interface IToast
     /// </summary>
     NotificationType Type { get; }
 
+    /// <summary>
+    /// Gets a value indicating whether the toast should show a close button.
+    /// </summary>
+    bool ShowClose { get; }
+
     /// <summary>
     /// Gets the expiration time of the toast after which it will automatically close.
     /// If the value is <see cref="TimeSpan.Zero"/> then the toast will remain open until the user closes it.

src/Ursa/Controls/Toast/Toast.cs

@@ -22,12 +22,14 @@ public class Toast : IToast, INotifyPropertyChanged
     /// <param name="type">The <see cref="NotificationType"/> of the toast.</param>
     /// <param name="expiration">The expiry time at which the toast will close. 
     /// Use <see cref="TimeSpan.Zero"/> for toasts that will remain open.</param>
+    /// <param name="showClose">A value indicating whether the toast should show a close button.</param>
     /// <param name="onClick">An Action to call when the toast is clicked.</param>
     /// <param name="onClose">An Action to call when the toast is closed.</param>
     public Toast(
         string? content,
         NotificationType type = NotificationType.Information,
         TimeSpan? expiration = null,
+        bool showClose = true,
         Action? onClick = null,
         Action? onClose = null)
     {
@@ -62,6 +64,9 @@ public class Toast : IToast, INotifyPropertyChanged
     /// <inheritdoc/>
     public NotificationType Type { get; set; }
 
+    /// <inheritdoc/>
+    public bool ShowClose { get; set; }
+
     /// <inheritdoc/>
     public TimeSpan Expiration { get; set; }
 

src/Ursa/Controls/Toast/ToastCard.cs

@@ -77,6 +77,14 @@ public class ToastCard : ContentControl
     /// </summary>
     public static readonly StyledProperty<NotificationType> NotificationTypeProperty =
         AvaloniaProperty.Register<ToastCard, NotificationType>(nameof(NotificationType));
+    public bool ShowClose
+    {
+        get => GetValue(ShowCloseProperty);
+        set => SetValue(ShowCloseProperty, value);
+    }
+
+    public static readonly StyledProperty<bool> ShowCloseProperty =
+        AvaloniaProperty.Register<ToastCard, bool>(nameof(ShowClose), true);
 
     /// <summary>
     /// Defines the <see cref="ToastClosed"/> event.

src/Ursa/Controls/Toast/WindowToastManager.cs

@@ -70,7 +70,7 @@ public class WindowToastManager : TemplatedControl, IManagedToastManager
     /// <inheritdoc/>
     public void Show(IToast content)
     {
-        Show(content, content.Type, content.Expiration, content.OnClick, content.OnClose);
+        Show(content, content.Type, content.Expiration, content.ShowClose, content.OnClick, content.OnClose);
     }
 
     /// <inheritdoc/>
@@ -78,7 +78,7 @@ public class WindowToastManager : TemplatedControl, IManagedToastManager
     {
         if (content is IToast toast)
         {
-            Show(toast, toast.Type, toast.Expiration, toast.OnClick, toast.OnClose);
+            Show(toast, toast.Type, toast.Expiration, toast.ShowClose, toast.OnClick, toast.OnClose);
         }
         else
         {
@@ -92,12 +92,14 @@ public class WindowToastManager : TemplatedControl, IManagedToastManager
     /// <param name="content">the content of the toast</param>
     /// <param name="type">the type of the toast</param>
     /// <param name="expiration">the expiration time of the toast after which it will automatically close. If the value is Zero then the toast will remain open until the user closes it</param>
+    /// <param name="showClose">whether to show the close button</param>
     /// <param name="onClick">an Action to be run when the toast is clicked</param>
     /// <param name="onClose">an Action to be run when the toast is closed</param>
     /// <param name="classes">style classes to apply</param>
     public async void Show(object content,
         NotificationType type,
         TimeSpan? expiration = null,
+        bool showClose = true,
         Action? onClick = null,
         Action? onClose = null,
         string[]? classes = null)
@@ -107,11 +109,12 @@ public class WindowToastManager : TemplatedControl, IManagedToastManager
         var toastControl = new ToastCard
         {
             Content = content,
-            NotificationType = type
+            NotificationType = type,
+            ShowClose = showClose
         };
 
         // Add style classes if any
-        if (classes != null)
+        if (classes is not null)
         {
             foreach (var @class in classes)
             {
@@ -119,19 +122,14 @@ public class WindowToastManager : TemplatedControl, IManagedToastManager
             }
         }
 
-        toastControl.ToastClosed += (sender, args) =>
+        toastControl.ToastClosed += (sender, _) =>
         {
             onClose?.Invoke();
 
             _items?.Remove(sender);
         };
 
-        toastControl.PointerPressed += (sender, args) =>
+        toastControl.PointerPressed += (_, _) => { onClick?.Invoke(); };
-        {
-            onClick?.Invoke();
-
-            (sender as ToastCard)?.Close();
-        };
 
         Dispatcher.UIThread.Post(() =>
         {
@@ -153,11 +151,6 @@ public class WindowToastManager : TemplatedControl, IManagedToastManager
         toastControl.Close();
     }
 
-    protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
-    {
-        base.OnPropertyChanged(change);
-    }
-
     /// <summary>
     /// Installs the <see cref="WindowToastManager"/> within the <see cref="AdornerLayer"/>
     /// </summary>