mirror of
				https://github.com/MindWorkAI/AI-Studio.git
				synced 2025-10-31 12:40:21 +00:00 
			
		
		
		
	Added a split button component
This commit is contained in:
		
							parent
							
								
									ea0ead58f8
								
							
						
					
					
						commit
						77513df6cc
					
				
							
								
								
									
										24
									
								
								app/MindWork AI Studio/Components/Blocks/SplitButton.razor
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										24
									
								
								app/MindWork AI Studio/Components/Blocks/SplitButton.razor
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,24 @@ | ||||
| @typeparam T | ||||
| 
 | ||||
| <MudButtonGroup Color="@this.Color" Variant="Variant.Filled"> | ||||
|     @if (string.IsNullOrWhiteSpace(this.Icon)) | ||||
|     { | ||||
|         <MudButton OnClick="() => this.OnClick(this.selectedValue)"> | ||||
|             @this.SelectedValueName() | ||||
|         </MudButton> | ||||
|     } | ||||
|     else | ||||
|     { | ||||
|         <MudButton StartIcon="@this.Icon" OnClick="() => this.OnClick(this.selectedValue)"> | ||||
|             @this.SelectedValueName() | ||||
|         </MudButton> | ||||
|     } | ||||
|     <MudMenu Icon="@Icons.Material.Filled.ArrowDropDown" Style="align-self: auto;"> | ||||
|         @foreach(var item in this.Items) | ||||
|         { | ||||
|             <MudMenuItem OnClick="() => this.SelectItem(item)"> | ||||
|                 @this.NameFunc(item) | ||||
|             </MudMenuItem> | ||||
|         } | ||||
|     </MudMenu> | ||||
| </MudButtonGroup> | ||||
| @ -0,0 +1,64 @@ | ||||
| using Microsoft.AspNetCore.Components; | ||||
| 
 | ||||
| namespace AIStudio.Components.Blocks; | ||||
| 
 | ||||
| public partial class SplitButton<T> : ComponentBase | ||||
| { | ||||
|     [Parameter] | ||||
|     public Color Color { get; set; } = Color.Default; | ||||
|      | ||||
|     [Parameter] | ||||
|     public string Icon { get; set; } = string.Empty; | ||||
| 
 | ||||
|     [Parameter] | ||||
|     public IReadOnlyCollection<T> Items { get; set; } = []; | ||||
|      | ||||
|     [Parameter] | ||||
|     public Func<T, string> NameFunc { get; set; } = _ => string.Empty; | ||||
|      | ||||
|     [Parameter] | ||||
|     public T? PreselectedValue { get; set; } | ||||
|      | ||||
|     [Parameter] | ||||
|     public Func<T?, Task> OnClick { get; set; } = _ => Task.CompletedTask; | ||||
|      | ||||
|     /// <summary> | ||||
|     /// What happens when the user selects an item by the dropdown? | ||||
|     /// Immediate = true means that the OnClick event is triggered immediately | ||||
|     /// after the user selects an item. Immediate = false means that the OnClick | ||||
|     /// event is triggered only when the user clicks the button. | ||||
|     /// </summary> | ||||
|     [Parameter] | ||||
|     public bool Immediate { get; set; } | ||||
| 
 | ||||
|     #region Overrides of ComponentBase | ||||
| 
 | ||||
|     protected override async Task OnInitializedAsync() | ||||
|     { | ||||
|         if(this.PreselectedValue is not null) | ||||
|             this.selectedValue = this.PreselectedValue; | ||||
|         else | ||||
|             this.selectedValue = this.Items.FirstOrDefault(); | ||||
|          | ||||
|         await base.OnInitializedAsync(); | ||||
|     } | ||||
| 
 | ||||
|     #endregion | ||||
| 
 | ||||
|     private T? selectedValue; | ||||
|      | ||||
|     private string SelectedValueName() | ||||
|     { | ||||
|         if(this.selectedValue is null) | ||||
|             return "Select..."; | ||||
|          | ||||
|         return this.NameFunc(this.selectedValue!); | ||||
|     } | ||||
|      | ||||
|     private void SelectItem(T item) | ||||
|     { | ||||
|         this.selectedValue = item; | ||||
|         if(this.Immediate) | ||||
|             this.OnClick(this.selectedValue); | ||||
|     } | ||||
| } | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user