Add Tree Grid search sample

samples/grids/tree-grid/data-searching/App.razor

@@ -0,0 +1,125 @@
+@using IgniteUI.Blazor.Controls
+
+<div class="container sample">
+    <div style="margin-bottom: 1rem">
+        <IgbInput ValueChanging="OnValueChanging" Value="@searchText" @onkeydown="OnSearchKeyDown">
+            @if (searchText.Length == 0)
+            {
+                <IgbIcon @ref="searchIconRef" slot="prefix" IconName="search" Collection="material" />
+            }
+            @if (searchText.Length > 0)
+            {
+                <IgbIcon slot="prefix" IconName="clear" Collection="material" @onclick="ClearSearch" />
+            }
+
+            <div class="chips" slot="suffix">
+                <IgbChip Selectable=true SelectedChanged="UpdateCase">
+                    Case Sensitive
+                </IgbChip>
+                <IgbChip Selectable=true SelectedChanged="UpdateExactSearch">
+                    Exact Match
+                </IgbChip>
+            </div>
+            <div class="searchButtons" slot="suffix">
+                <IgbIconButton Variant="IconButtonVariant.Flat" @onclick="PrevSearch">
+                    <IgbIcon IconName="prev" Collection="material" />
+                </IgbIconButton>
+                <IgbIconButton Variant="IconButtonVariant.Flat" @onclick="NextSearch">
+                    <IgbIcon IconName="next" Collection="material" />
+                </IgbIconButton>
+            </div>
+        </IgbInput>
+    </div>
+
+    <div class="container vertical">
+        <IgbTreeGrid @ref=treeGrid AutoGenerate=false Data=EmployeesFlatData PrimaryKey="ID" ForeignKey="ParentID" AllowFiltering=true Height="100%" Width="100%">
+            <IgbColumn Field="Name" DataType="GridColumnDataType.String" Sortable=true></IgbColumn>
+            <IgbColumn Field="ID" DataType="GridColumnDataType.Number" Sortable=true></IgbColumn>
+            <IgbColumn Field="Title" DataType="GridColumnDataType.String" Sortable=true></IgbColumn>
+            <IgbColumn Field="Age" DataType="GridColumnDataType.Number" Sortable=true></IgbColumn>
+            <IgbColumn Field="HireDate" DataType="GridColumnDataType.Date" Sortable=true></IgbColumn>
+        </IgbTreeGrid>
+    </div>
+</div>
+
+@code {
+    private IgbTreeGrid treeGrid;
+
+    public bool caseSensitive = false;
+    public bool exactMatch = false;
+    public string searchText = "";
+
+    private IgbIcon searchIconRef { get; set; }
+    const string searchIcon = "<svg width='24' height='24' viewBox='0 0 24 24'><path d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z' /></svg>";
+    const string prevIcon = "<svg width='24' height='24' viewBox='0 0 24 24'><path d='M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z'></path></svg>";
+    const string nextIcon = "<svg width='24' height='24' viewBox='0 0 24 24'><path d='M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z'></path></svg>";
+    const string clearIcon = "<svg width='24' height='24' viewBox='0 0 24 24' title='Clear'><path d='M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'></path></svg>";
+
+    private EmployeesFlatData _employeesFlatData = null;
+    public EmployeesFlatData EmployeesFlatData
+    {
+        get
+        {
+            if (_employeesFlatData == null)
+            {
+                _employeesFlatData = new EmployeesFlatData();
+            }
+            return _employeesFlatData;
+        }
+    }
+
+    protected override void OnAfterRender(bool firstRender)
+    {
+        if (this.searchIconRef != null && firstRender)
+        {
+            this.searchIconRef.EnsureReady().ContinueWith(new Action<Task>((e) =>
+            {
+                this.searchIconRef.RegisterIconFromTextAsync("search", searchIcon, "material");
+                this.searchIconRef.RegisterIconFromTextAsync("prev", prevIcon, "material");
+                this.searchIconRef.RegisterIconFromTextAsync("next", nextIcon, "material");
+                this.searchIconRef.RegisterIconFromTextAsync("clear", clearIcon, "material");
+            }));
+        }
+    }
+
+    private void OnSearchKeyDown(KeyboardEventArgs evt)
+    {
+        if (evt.Key == "Enter" || evt.Key == "ArrowDown") {
+            this.treeGrid.FindNextAsync(this.searchText, this.caseSensitive, this.exactMatch);
+        } else if (evt.Key == "ArrowUp") {
+            this.treeGrid.FindPrevAsync(this.searchText, this.caseSensitive, this.exactMatch);
+        }
+    }
+
+    public void OnValueChanging(string newValue)
+    {
+        this.searchText = newValue;
+        this.treeGrid.FindNextAsync(this.searchText, this.caseSensitive, this.exactMatch);
+    }
+
+    public void PrevSearch()
+    {
+        this.treeGrid.FindPrevAsync(this.searchText, this.caseSensitive, this.exactMatch);
+    }
+
+    public void NextSearch()
+    {
+        this.treeGrid.FindNextAsync(this.searchText, this.caseSensitive, this.exactMatch);
+    }
+
+    public void ClearSearch()
+    {
+        this.searchText = "";
+        this.treeGrid.ClearSearchAsync();
+    }
+
+    public void UpdateCase(bool selected) {
+        this.caseSensitive = selected;
+        this.treeGrid.FindNextAsync(this.searchText, this.caseSensitive, this.exactMatch);
+    }
+
+    public void UpdateExactSearch(bool selected) {
+        this.exactMatch = selected;
+        this.treeGrid.FindNextAsync(this.searchText, this.caseSensitive, this.exactMatch);
+    }
+}

samples/grids/tree-grid/data-searching/BlazorClientApp.csproj

@@ -0,0 +1,21 @@
+<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
+
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <RazorLangVersion>3.0</RazorLangVersion>
+    <AssemblyName>Infragistics.Samples</AssemblyName>
+    <RootNamespace>Infragistics.Samples</RootNamespace>
+  </PropertyGroup>
+
+  <PropertyGroup Condition="'$(Configuration)|$(Platform)'=='Debug|AnyCPU'">
+    <NoWarn>1701;1702,IDE0028,BL0005,0219,CS1998</NoWarn>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="IgniteUI.Blazor" Version="23.2.204" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.0" />
+    <PackageReference Include="System.Net.Http.Json" Version="8.0.0" />
+  </ItemGroup>
+
+</Project>

samples/grids/tree-grid/data-searching/BlazorClientApp.sln

@@ -0,0 +1,25 @@
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 16
+VisualStudioVersion = 16.0.29613.14
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "BlazorClientApp", "BlazorClientApp.csproj", "{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|Any CPU = Debug|Any CPU
+		Release|Any CPU = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.Build.0 = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {FC52AAC8-4488-40AE-9621-75F6BA744B18}
+	EndGlobalSection
+EndGlobal

samples/grids/tree-grid/data-searching/EmployeesFlatData.cs

@@ -0,0 +1,219 @@
+using System.Collections.Generic;
+
+public class EmployeesFlatDataItem
+{
+    public double Age { get; set; }
+    public string HireDate { get; set; }
+    public double ID { get; set; }
+    public string Name { get; set; }
+    public string Phone { get; set; }
+    public bool OnPTO { get; set; }
+    public double ParentID { get; set; }
+    public string Title { get; set; }
+}
+
+public class EmployeesFlatData
+    : List<EmployeesFlatDataItem>
+{
+    public EmployeesFlatData()
+    {
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 55,
+            HireDate = @"2008-03-20",
+            ID = 1,
+            Name = @"Johnathan Winchester",
+            Phone = @"0251-031259",
+            OnPTO = false,
+            ParentID = -1,
+            Title = @"Development Manager"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 42,
+            HireDate = @"2014-01-22",
+            ID = 4,
+            Name = @"Ana Sanders",
+            Phone = @"(21) 555-0091",
+            OnPTO = true,
+            ParentID = -1,
+            Title = @"CEO"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 49,
+            HireDate = @"2014-01-22",
+            ID = 18,
+            Name = @"Victoria Lincoln",
+            Phone = @"(071) 23 67 22 20",
+            OnPTO = true,
+            ParentID = -1,
+            Title = @"Accounting Manager"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 61,
+            HireDate = @"2010-01-01",
+            ID = 10,
+            Name = @"Yang Wang",
+            Phone = @"(21) 555-0091",
+            OnPTO = false,
+            ParentID = -1,
+            Title = @"Localization Manager"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 43,
+            HireDate = @"2011-06-03",
+            ID = 3,
+            Name = @"Michael Burke",
+            Phone = @"0452-076545",
+            OnPTO = true,
+            ParentID = 1,
+            Title = @"Senior Software Developer"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 29,
+            HireDate = @"2009-06-19",
+            ID = 2,
+            Name = @"Thomas Anderson",
+            Phone = @"(14) 555-8122",
+            OnPTO = false,
+            ParentID = 1,
+            Title = @"Senior Software Developer"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 31,
+            HireDate = @"2014-08-18",
+            ID = 11,
+            Name = @"Monica Reyes",
+            Phone = @"7675-3425",
+            OnPTO = false,
+            ParentID = 1,
+            Title = @"Software Development Team Lead"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 35,
+            HireDate = @"2015-09-17",
+            ID = 6,
+            Name = @"Roland Mendel",
+            Phone = @"(505) 555-5939",
+            OnPTO = false,
+            ParentID = 11,
+            Title = @"Senior Software Developer"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 44,
+            HireDate = @"2009-10-11",
+            ID = 12,
+            Name = @"Sven Cooper",
+            Phone = @"0695-34 67 21",
+            OnPTO = true,
+            ParentID = 11,
+            Title = @"Senior Software Developer"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 44,
+            HireDate = @"2014-04-04",
+            ID = 14,
+            Name = @"Laurence Johnson",
+            Phone = @"981-443655",
+            OnPTO = false,
+            ParentID = 4,
+            Title = @"Director"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 25,
+            HireDate = @"2017-11-09",
+            ID = 5,
+            Name = @"Elizabeth Richards",
+            Phone = @"(2) 283-2951",
+            OnPTO = true,
+            ParentID = 4,
+            Title = @"Vice President"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 39,
+            HireDate = @"2010-03-22",
+            ID = 13,
+            Name = @"Trevor Ashworth",
+            Phone = @"981-443655",
+            OnPTO = true,
+            ParentID = 5,
+            Title = @"Director"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 44,
+            HireDate = @"2014-04-04",
+            ID = 17,
+            Name = @"Antonio Moreno",
+            Phone = @"(505) 555-5939",
+            OnPTO = false,
+            ParentID = 18,
+            Title = @"Senior Accountant"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 50,
+            HireDate = @"2007-11-18",
+            ID = 7,
+            Name = @"Pedro Rodriguez",
+            Phone = @"035-640230",
+            OnPTO = false,
+            ParentID = 10,
+            Title = @"Senior Localization Developer"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 27,
+            HireDate = @"2016-02-19",
+            ID = 8,
+            Name = @"Casey Harper",
+            Phone = @"0342-023176",
+            OnPTO = true,
+            ParentID = 10,
+            Title = @"Senior Localization"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 25,
+            HireDate = @"2017-11-09",
+            ID = 15,
+            Name = @"Patricia Simpson",
+            Phone = @"069-0245984",
+            OnPTO = false,
+            ParentID = 7,
+            Title = @"Localization Intern"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 39,
+            HireDate = @"2010-03-22",
+            ID = 9,
+            Name = @"Francisco Chang",
+            Phone = @"(91) 745 6200",
+            OnPTO = false,
+            ParentID = 7,
+            Title = @"Localization Intern"
+        });
+        this.Add(new EmployeesFlatDataItem()
+        {
+            Age = 25,
+            HireDate = @"2018-03-18",
+            ID = 16,
+            Name = @"Peter Lewis",
+            Phone = @"069-0245984",
+            OnPTO = true,
+            ParentID = 7,
+            Title = @"Localization Intern"
+        });
+    }
+}