MudSelectExtended

CodeBeam.MudExtensions.UnitTest.Viewer/CodeBeam.MudExtensions.UnitTest.Viewer.csproj → CodeBeam.MudExtensions.UnitTests.Viewer/CodeBeam.MudExtensions.UnitTests.Viewer.csproj

@@ -5,15 +5,15 @@
     <Nullable>disable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
   </PropertyGroup>
-
+	
 	<ItemGroup>
-		<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.11.*" />
-		<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.11.*" PrivateAssets="all" />
-		<PackageReference Include="System.Net.Http.Json" Version="6.0.0.*" />
+	  <ProjectReference Include="..\CodeBeam.MudExtensions\CodeBeam.MudExtensions.csproj" />
 	</ItemGroup>
 
-  <ItemGroup>
-    <ProjectReference Include="..\CodeBeam.MudExtensions\CodeBeam.MudExtensions.csproj" />
-  </ItemGroup>
+	<ItemGroup>
+		<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.11" />
+		<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.11" PrivateAssets="all" />
+		<PackageReference Include="System.Net.Http.Json" Version="6.0.0" />
+	</ItemGroup>
 
 </Project>

CodeBeam.MudExtensions.UnitTest.Viewer/Pages/Index.razor → CodeBeam.MudExtensions.UnitTests.Viewer/Pages/Index.razor

@@ -6,4 +6,4 @@
 
 Welcome to your new app.
 
-<SurveyPrompt Title="How is Blazor working for you?" />
+<CodeBeam.MudExtensions.UnitTests.TestComponents.SelectOnCloseTest />

CodeBeam.MudExtensions.UnitTest.Viewer/Program.cs → CodeBeam.MudExtensions.UnitTests.Viewer/Program.cs

@@ -1,11 +1,14 @@
-using CodeBeam.MudExtensions.UnitTest.Viewer;
+using CodeBeam.MudExtensions.UnitTests.Viewer;
 using Microsoft.AspNetCore.Components.Web;
 using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
+using MudBlazor.Services;
 
 var builder = WebAssemblyHostBuilder.CreateDefault(args);
 builder.RootComponents.Add<App>("#app");
 builder.RootComponents.Add<HeadOutlet>("head::after");
 
 builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
+builder.Services.AddMudServices();
+builder.Services.AddMudExtensions();
 
 await builder.Build().RunAsync();

CodeBeam.MudExtensions.UnitTest.Viewer/Shared/MainLayout.razor → CodeBeam.MudExtensions.UnitTests.Viewer/Shared/MainLayout.razor

@@ -15,3 +15,7 @@
         </article>
     </main>
 </div>
+
+<MudThemeProvider />
+<MudDialogProvider />
+<MudSnackbarProvider />

CodeBeam.MudExtensions.UnitTest.Viewer/Shared/NavMenu.razor → CodeBeam.MudExtensions.UnitTests.Viewer/Shared/NavMenu.razor

@@ -1,6 +1,6 @@
 <div class="top-row ps-3 navbar navbar-dark">
     <div class="container-fluid">
-        <a class="navbar-brand" href="">CodeBeam.MudExtensions.UnitTest.Viewer</a>
+        <a class="navbar-brand" href="">CodeBeam.MudExtensions.UnitTests.Viewer</a>
         <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
             <span class="navbar-toggler-icon"></span>
         </button>
@@ -30,7 +30,7 @@
 @code {
     private bool collapseNavMenu = true;
 
-    private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
+    private string NavMenuCssClass => collapseNavMenu ? "collapse" : null;
 
     private void ToggleNavMenu()
     {

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectCustomizedTextTest.razor

@@ -0,0 +1,45 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudSelectExtended Label="Select Item" 
+    MultiSelection="true" 
+    T="@TestItem" 
+    SelectedValues="@SelectedItems" 
+    ToStringFunc="@ToString"
+    MultiSelectionTextFunc="GetMultiSelectionText">
+
+    @foreach (TestItem item in AllItems)
+    {
+        <MudSelectItemExtended Value="@item" />
+    }
+</MudSelectExtended>
+
+@code {
+
+    private List<TestItem> AllItems = new();    
+    private HashSet<TestItem> SelectedItems = new();
+    protected override async Task OnInitializedAsync()
+    {
+        AllItems.Add(new TestItem { A = "FirstA" });
+        AllItems.Add(new TestItem { A = "SecondA" });
+        AllItems.Add(new TestItem { A = "ThirdA" });
+
+        SelectedItems.Add(AllItems[0]);
+        SelectedItems.Add(AllItems[1]);
+        await base.OnInitializedAsync();
+    }
+
+    private string ToString(TestItem x)
+        => x is null ? string.Empty : $"{x.A}";
+
+    private string GetMultiSelectionText(List<TestItem> selectedValues)
+    {
+        return $"Selected values: {string.Join(", ", selectedValues.Select(x => x.A))}";
+    }
+
+    private class TestItem
+    {
+        public string A { get; set; }        
+    }
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTest1.razor

@@ -0,0 +1,15 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudSelectExtended @bind-SelectedValues="values" MultiSelection="true">
+    <MudSelectItemExtended Value="@("1")">1</MudSelectItemExtended>
+    <MudSelectItemExtended Value="@("2")">2</MudSelectItemExtended>
+    <MudSelectItemExtended Value="@("3")">3</MudSelectItemExtended>
+</MudSelectExtended>
+
+
+@code {
+    public static string __description__ = "Click should not close the menu and selecting multiple values should update the bindable value with a comma separated list.";
+
+    IEnumerable<string> values = new HashSet<string>();
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTest2.razor

@@ -0,0 +1,27 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudSelectExtended Label="Select Item" 
+    MultiSelection="true" 
+    T="string" 
+    Delimiter="^"
+    SelectAll="true"
+    @bind-SelectedValues="@SelectedItems">
+
+    @foreach (var item in AllItems)
+    {
+        <MudSelectItemExtended T="string" Value="@item">@item</MudSelectItemExtended>
+    }
+</MudSelectExtended>
+
+@code {
+    public static string __description__ = "Test for the Select All option";
+    private List<string> AllItems = new();    
+    private IEnumerable<string> SelectedItems = new HashSet<string>();
+    protected override void OnInitialized()
+    {
+        AllItems.Add("FirstA");
+        AllItems.Add("SecondA");
+        AllItems.Add("ThirdA");
+    }
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTest3.razor

@@ -0,0 +1,35 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudGrid>
+    <MudItem xs="12" md="6">
+        <MudText Typo="Typo.body2">MudSelect.Value: "@value"</MudText>
+        <MudText Typo="Typo.body2">Selected Values: "@string.Join(", ", options ?? new List<string>())"</MudText>
+    </MudItem>
+    <MudItem xs="12" md="12">
+        <MudSelectExtended T="string" @bind-Value="value" @bind-SelectedValues="options" Label="Felines" HelperText="Pick your favorite feline"
+                   MultiSelection="true" SelectAll="true" SelectAllText="Select all felines"
+                    AdornmentIcon="@Icons.Material.Filled.Search"
+                   MultiSelectionTextFunc="@(new Func<List<string>, string>(GetMultiSelectionText))">
+            @foreach (var feline in felines)
+            {
+                <MudSelectItemExtended T="string" Value="@feline">@feline</MudSelectItemExtended>
+            }
+        </MudSelectExtended>
+    </MudItem>
+</MudGrid>
+
+@code {
+    private string value { get; set; } = "Nothing selected";
+    private IEnumerable<string> options { get; set; } = new HashSet<string>() { "Lion" };
+
+    private string[] felines =
+    {
+        "Jaguar", "Leopard", "Lion", "Lynx", "Panther", "Puma", "Tiger"
+    };
+
+    private string GetMultiSelectionText(List<string> selectedValues)
+    {
+        return $"{selectedValues.Count} feline{(selectedValues.Count > 1 ? "s have" : " has")} been selected";
+    }
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTest4.razor

@@ -0,0 +1,34 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudGrid>
+    <MudItem xs="12" md="12">
+        <MudSelectExtended T="string" Label="Felines" HelperText="Pick your favorite feline"
+                   MultiSelection="true" SelectAll="true" SelectAllText="Select all felines"
+                   @bind-Value="value" @bind-SelectedValues="options" AdornmentIcon="@Icons.Material.Filled.Search"
+                   MultiSelectionTextFunc="@(new Func<List<string>, string>(GetMultiSelectionText))">
+            @foreach (var feline in felines)
+            {
+                <MudSelectItemExtended T="string" Value="@feline">@feline</MudSelectItemExtended>
+            }
+        </MudSelectExtended>
+    </MudItem>
+    <MudItem xs="12" md="6">
+        <MudText Typo="Typo.body2">MudSelect.Value: "@value"</MudText>
+    </MudItem>
+</MudGrid>
+
+@code {
+    private string value { get; set; } = "Nothing selected";
+    private IEnumerable<string> options { get; set; }
+
+    private string[] felines =
+    {
+        "Jaguar", "Leopard", "Lion", "Lynx", "Panther", "Puma", "Tiger"
+    };
+
+    private string GetMultiSelectionText(List<string> selectedValues)
+    {
+        return $"{selectedValues.Count} feline{(selectedValues.Count > 1 ? "s have" : " has")} been selected";
+    }
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTest5.razor

@@ -0,0 +1,30 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+
+@if (_posts != null)
+{
+    <MudSelectExtended Label="Roles" T="string" SelectedValues="SelectedValues" MultiSelection="true">
+        @foreach (var role in _posts)
+        {
+            <MudSelectItemExtended T="string" Value="@role">@role</MudSelectItemExtended>
+        }
+    </MudSelectExtended>
+}
+
+
+@code
+{
+    private IEnumerable<string> SelectedValues { get; set; } = new HashSet<string>()
+    { 
+        "Programista", "test"
+    };
+
+    private HashSet<string> _posts;
+
+    protected override void OnInitialized()
+    {
+        _posts = new HashSet<string>
+        {
+            "Programista", "Programista 2", "test", "Technik", "Tester", "Tester tester"
+        };
+    }
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTestRequiredValue.razor

@@ -0,0 +1,42 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudSelectExtended @bind-Value="value" Label="String Binding" MultiSelection="true" IsPreRendered="true" Required="true" Clearable="true">
+    <MudSelectItemExtended Value="@("1")">1</MudSelectItemExtended>
+    <MudSelectItemExtended Value="@("2")">2</MudSelectItemExtended>
+    <MudSelectItemExtended Value="@("3")">3</MudSelectItemExtended>
+</MudSelectExtended>
+
+<MudSelectExtended T=TestClass Label="Object Binding" MultiSelection="true" Required="true" @bind-SelectedValues="SelectedRoles" Clearable="true">
+    @foreach(var role in Roles)
+    {
+        <MudSelectItemExtended T="TestClass" Value=@role/>
+    }
+</MudSelectExtended>
+
+@code {
+
+	public static string __description__ = "Multi-Select Required Should Recognize Values";
+
+    string value=null;
+
+    public class TestClass
+    {
+        public string Name { get; set; }
+        public string NameTranslated { get; set; }
+        public override string ToString() => Name;
+    }
+
+
+    public List<TestClass> Roles {get; set; } = new();
+    public IEnumerable<TestClass> SelectedRoles = new List<TestClass>();
+
+    Func<TestClass, string> converter = p => p?.NameTranslated;
+
+	protected override void OnInitialized()
+    {
+        Roles.Add(new TestClass() { Name ="Admin", NameTranslated="Administrator"});
+        Roles.Add(new TestClass() { Name ="Customer", NameTranslated="Kunde"});
+    }
+
+}

CodeBeam.MudExtensions.UnitTests.Viewer/TestComponents/SelectExtended/MultiSelectTextTest.razor

@@ -0,0 +1,19 @@
+@namespace CodeBeam.MudExtensions.UnitTests.TestComponents
+
+<MudPopoverProvider></MudPopoverProvider>
+
+<MudSelectExtended Label="Select Item" 
+    MultiSelection="true"
+    T="int?">
+
+    <MudSelectItemExtended T="int?" Value="null" Text="Empty" />
+    <MudSelectItemExtended T="int?" Value="1" Text="One" />
+    <MudSelectItemExtended T="int?" Value="2" />
+    <MudSelectItemExtended T="int?" Value="3" Text="3" />
+
+</MudSelectExtended>
+
+@code {
+
+
+}